css怎么实现鼠标移动到div块时自动加阴影效果？

我们在浏览各大网站时，点击其中的图片可能会出现放大或者旋转等等的特效。这种效果的确能让人眼前一亮，也就可能带来用户点击的流量。当然强大的css功能不仅仅只有这样特效。本篇文章就给大家介绍一种更加酷炫的特效即当鼠标移入div块时产生的css阴影效果，这样就能立即产生立体感。

css阴影效果具体代码示例如下：

以上的代码测试效果css阴影边框如下图：

注：无论是给那个元素加阴影都离不开一个重要的属性 :hover 伪类。

:hover 伪类就是在鼠标移到元素上时向此元素添加特殊的样式。只要你掌握了这个hover的使用方法，无论是给div块还是图片加阴影都可以轻松实现这样的效果。

这个伪类是应用处于“悬停状态”的元素。悬停定义为用户指示了一个元素但没有将其激活。对此最常见的例子是将鼠标指针移到 HTML 文档中一个超链接的边界范围内。理论上，其他元素也可以处于悬停状态，不过 CSS 没有定义究竟是哪些元素。

【相关内容推荐】

在页面中怎么用css让图片有立体感的效果?（代码实测）

html5极速3D立体式图片相册切换效果

以上是css怎么实现鼠标移动到div块时自动加阴影效果？的详细内容。更多信息请关注PHP中文网其他相关文章！