css盒子添加影子 |css 字体 模糊

.box {
box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.1);
}

上述代码给class为”box”的盒子添加了一个淡淡的灰色阴影效果，可以通过修改box-shadow属性的值来调整阴影的大小和颜色，也可以添加多个阴影层。

.box {
box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.1),
2px 2px 10px rgba(0, 0, 0, 0.2);
}

上述代码给class为”box”的盒子添加了两个不同大小、不同透明度的阴影效果，可以通过调整第二个阴影的偏移量和颜色来让阴影层看上去更加立体。

需要注意的是，box-shadow属性在IE6-8的浏览器中不支持，但可以通过CSS3PIE等插件来实现该效果。