版权声明：X北辰北 https://blog.csdn.net/qq_35117024/article/details/82894772
浮动效果其实在很多的UI组件中都已经实现了，尤其是在很多的卡片组件中都有相应的参数可以进行设置。今天我们主要介绍的是如何自己用原生的css来实现浮动效果。
在div的所有属性中，有一个“box-shadow”的属性，此属性是设置阴影效果的属性，我们对一个div进行如下图所示的设置，即可实现简单的浮动效果，如图：
效果如下：
大家也可以按照自己的需求对此属性继续修改，达到逼真的效果。
此属性设置完之后，配合鼠标的经过事件（mouseenter、mouseleave）就可以实现鼠标滑过此div后出现浮动效果的功能了。