淘先锋技术网

首页 1 2 3 4 5 6 7

在CSS中,div是最常用的元素之一,它可以用于布局、定位、容器等多种场景。除此之外,div还具有一项强大的特性——阴影。

div {
box-shadow: 0 3px 6px rgba(0,0,0,0.16);
}

上述代码表示将div的阴影设置为向下偏移3像素,松散程度为6像素,颜色为半透明的黑色。如果想设置阴影向上或向左偏移,只需要在第一个参数中使用负数即可。

除了这个简单的例子,CSS还提供了更多复杂的阴影效果,如多重阴影、内部阴影等。以下是一个多重阴影的示例:

div {
box-shadow: 0 3px 6px rgba(0,0,0,0.16),
0 3px 6px rgba(0,0,0,0.23);
}

上述代码表示将div设置为两个阴影,一个颜色较浅、松散程度较大的阴影在上方,一个颜色较深、松散程度较小的阴影在下方。

个人认为,CSS中的阴影是一个非常实用的特性,可以增加页面的立体感和深度感,让页面更加生动、鲜活。