将鼠标放到div上使div浮起的动态效果

可以使用CSS的:hover伪类和box-shadow属性来实现将鼠标放到div上使div浮起的动态效果。

HTML代码：

<div class="box"></div>

CSS代码：

.box {
  width: 200px;
  height: 200px;
  background-color: gray;
  transition: box-shadow 0.3s ease-in-out;
}

.box:hover {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

解释说明：

首先，我们创建一个class为“box”的div元素，并设置它的宽度、高度和背景颜色。然后，我们使用CSS的transition属性来设置box-shadow属性的过渡效果，使鼠标悬停时div元素浮起的效果更加平滑。

接着，我们使用:hover伪类来设置鼠标悬停时的样式，这里我们设置box-shadow属性的值为“0 0 10px rgba(0, 0, 0, 0.5)”，表示在div元素周围添加一个10像素的阴影，并设置阴影的颜色为半透明的黑色。

当鼠标悬停在div元素上时，CSS会自动应用:hover伪类设置的样式，从而实现将鼠标放到div上使div浮起的动态效果