温馨提示：这篇文章已超过241天没有更新，请注意相关的内容是否还可用！
要给一个div元素添加阴影效果，可以使用CSS的box-shadow属性。该属性可以为元素添加一个或多个阴影效果，使元素看起来有立体感。
示例代码如下：
<!DOCTYPE html>
<html>
<head>
<style>
div {
width: 200px;
height: 200px;
background-color: #f1f1f1;
box-shadow: 5px 5px 10px #888888;
}
</style>
</head>
<body>
<div></div>
</body>
</html>
在上面的示例中，我们为div元素添加了一个阴影效果。box-shadow属性的值由四个参数组成，分别是水平偏移量、垂直偏移量、模糊半径和颜色。在示例中，我们将阴影向右偏移了5个像素，向下偏移了5个像素，模糊半径为10个像素，阴影的颜色为#888888。
通过调整这些参数的值，可以实现不同的阴影效果。例如，将水平偏移量和垂直偏移量都设置为0，可以实现一个底部阴影效果；将模糊半径设置为0，可以得到一个清晰的阴影效果。
通过使用box-shadow属性，我们可以轻松为div元素添加阴影效果，使其在页面上更加突出和立体。
文章版权声明：除非注明，否则均为莫宇前端原创文章，转载或复制请以超链接形式并注明出处。
