在以前，阴影效果曾让 Web 设计师既爱又恨，要实现阴影的效果就必须做图、切图和繁锁的页面布局，不但开发起来麻烦，同时也会引入更多的代码，使页面变得雍肿；而现在我们有了 CSS3，做阴影效果不再需要 Photoshop，随着浏览器的普遍支持，越来越多的网站都在使用这个功能。

块阴影由以下三句CSS代码便可实现：

-webkit-box-shadow: 10px 10px 25px #ccc;
-moz-box-shadow: 10px 10px 25px #ccc;
box-shadow: 10px 10px 25px #ccc;

前两个属性设置阴影的 X / Y 位移，这里分别是 10px，第3个属性定义阴影的虚化程度，最后一个设置阴影的颜色。

而文字阴影只需要设置text-shadow即可：

text-shadow: 2px 2px 5px #ccc;

目前支持阴影效果的浏览器：Firefox 3.1+, Safari, Chrome, Opera, IE 10+
合理使用阴影效果将可以给页面带来更友好，更美观的效果