上一篇把border-radius拉上台走了个秀，今天我们轮着角色接着走。台下一团shadow在蠕动，恩，今天上台的是一个shadow属性。关于shadow的属性有两个：box-shadow和text-shadow，今天我们说的是text-shadow先。
一、shadow阴影的背后text-shadow在CSS2中出现过，可是昙花一现，在CSS2.1中又被抛弃了，现在这团阴影又在CSS3中满血归来。
顾名思义，text-shadow是用来给文字添加阴影效果的。在网页上我们会看到各种各样绚丽的文字阴影效果，也许我们会问这些个效果是怎么做到的，用text-shadow设置的话应该怎么取值，为什么要这样取值而不是那样取值。
回答这些问题其实并不难，首先我们得先明白，text-shadow到底是个什么东西。
也许有小伙伴会说，text-shadow不就是text-shadow不就是文字阴影吗，这有什么可说的。这不能说不对，而我要说的并不是这个，我想让小伙伴明白的是：
text-shadow 就是文字的一个副本。看下图：
白色文本为文本本体，红色文本为文本阴影，阴影就是本体的一个副本一个分身。
text-shadow是被修饰文字的一个副本，是被修饰文字的一个分身，俗话就是：如果不对阴影进行修饰的话，文字阴影就是文字一模一样的一个分身。记住了这句话，讲非常有助于我们理解不同的文字阴影效果应该怎么给text-shadow取值。
二、关于text-shadow属性的取值特点首先有必要看一下text-shadow的语法：
text-shadow: h-shadow v-shadow blur color;
h-shadow是指水平阴影的位置，即水平偏置，允许负值。值为正时，阴影向右偏移，值为负时，阴影向左偏移；
v-shadow是指垂直阴影的位置，即垂直偏置，允许负值。值为正时，阴影向底部偏移，值为负时，阴影向顶部偏移；
blur是指模糊距离，即模糊的范围大小；
注：要充分理解blur的含义，请猛戳这里这里看第三节的第二个实现。
color阴影颜色。
其中，h-shadow和v-shadow是必选项，blur和color是可选项。
text-shadow可以为文字添加一个或多个阴影，添加多个阴影的时候阴影列表需要用逗号隔开。
在正式讲解text-shadow属性取值方法之前，先说几点我自己对text-shadow的理解：
1、blur值越大，阴影越模糊；再注：要充分理解blur的含义，请猛戳这里这里看第三节的第二个实现。
2、透明transparent也可以当成一种color；
3、文本副本的叠加能实现成排的效果；
4、多种颜色的叠加会造成特殊的视觉特效；
三、从原理出发理解阴影特效的实现下面以实例来讲解如何从原理出发根据自己的想法来实现相应的效果。首先，先把一段文字demo贴上：
HTML Markup：
text demo
查看更多关于CSS3小分队--text分身text-shadow_html/css_WEB-ITnose的详细内容...
声明：本文来自网络，不代表【好得很程序员自学网】立场，转载请注明出处：http://haodehen.cn/did108481