/* 添加文本阴影 */ text-shadow: 2px 2px 5px #000000; /* 添加盒子阴影 */ box-shadow: 2px 2px 5px #000000;
在上面的例子中,大家可以看到如何使用text-shadow和box-shadow属性来添加阴影效果。两个例子中都使用了偏移量(x轴和y轴)、模糊度和颜色。只需要改变这些值,就可以创建出不同的阴影效果。下面是一个例子,展示了如何创建一个带有多层阴影的盒子。
/* 创建一个带有多层阴影的盒子 */ box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1), 0 6px 10px rgba(0, 0, 0, 0.1), 0 3px 4px rgba(0, 0, 0, 0.3);
上面的例子中使用了多个box-shadow属性来创建不同的阴影层。每个属性都对应一个不同的阴影层。使用这种方法可以创建出更加复杂的阴影效果。