正在阅读：利用CSS3实现质感阴影文字的思路和方法利用CSS3实现质感阴影文字的思路和方法

为什么使用text-shadow：

　　·可以增强文字质感；

　　·可以减少图片的使用,减少带宽支出；

　　·随着Firefox 3.5支持text-shadow,不久很多人将可以看到你定义的阴影。

　　不相信？请看看下面的截图，这是对http://tweetcc.com/网站分别在safari 4(win)与Firefox 3.0.11下所进行的截图。很明显在有text-shadow应用下整体文字层次感好了许多。

图3

其他例子

　　接下来我们继续看看一些有趣的text-shadow下的例子吧，首先看看vikiworks 用text-shadow来显示程序代码.很多人都觉得这个效果很赞，没错,该网站用的就是css3属性。

图4

参考资料及常见问题

　　看完上面觉得不够，那么可以参考一下下面的文章：

　　http://www.css3.info/preview/text-shadow/

　　http://www.w3.org/TR/2003/CR-css3-text-20030514/#text-shadows

　　http://www.quirksmode.org/css/textshadow.html

问题有:

　　如果使用了blur，也就是定义了阴影模糊半径，会导致页面在滚动时变慢。

　　转载请注明来源：http://www.ediyang.com/css3-text-shadow-why-and-how/

　　请留意：本文章旨在抛砖引玉引起大家对CSS3的兴趣。也比较侧重该属性呈现的效果，所以对该属性的技术性讲解及定义都有所偏差，请原谅。