上浮并且阴影变化

/exp/interactive/hover/上浮阴影/

html

<div class="hover-shadow">
  <img src="https://mc.kurogames.com/static4.0/assets/weilinai-4a35ce55.png" />
</div>

css

.hover-shadow {
  width: 200px;
  height: 200px;
  overflow: hidden;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease-in-out;
}

.hover-shadow img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hover-shadow:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}