QQ 1640076782

2013年11月27日

CSS3实现文字有阴影效果的方法

Filed under: 英语网站设计 — 标签：, — lifengwu @ 10:33 上午

给文字添加个阴影，有时候能够使网页增色不少，但是如果直要用起来却很麻烦，因为需要先将效果在PS中做出来再存储成图片才能在网页中显示，也使得这个效果用得很少。不过现在通过CSS3可直接在网页中生成这个效果，用起来就方便多了！下面我们就来看一下它的用法吧：

text-shadw:length length length color
前三个属性值为阴影在X轴上的位移、Y轴上的位移、模糊半径，color指阴影的颜色。
我们可以这样定义：
text-shadow:1px 1px 2px #f00;

text-shadow:1px 1px 2px #000;

而且还可以使用text-shadow属性给文字指定多个阴影，并且针对每个阴影使用不同过的颜色。指定多个阴影时，使用逗号将多个阴影进行分割。

text-shadow:1px 1px 3px #000,3px 3px 1px #f00;