在开发CSS3时要记住添加相关的浏览器私有前缀以保证最广泛的浏览器兼容。(可以使用javascript,脚本地址为:http://leaverou.github.com/prefixfree/。或者去我的资源里下载也可以。)
1、文字阴影
基本语法:
.element{text-shadow:1px 1px 1px #cccccc;}
//.element{text-shadow:-1px -1px 1px #cccccc;}//左上方阴影
//.element{text-shadow:0 1px 0 hsla(0,0%,100%,0.75);}//浮雕
//.element{text-shadow:0 1px #cccccc,4px 4px 0px #dad7d7;}//多重文字阴影
//.element{text-shadow:none;}//取消阴影
记住,阴影值的速记规则永远是先向右再向下。因此,第一个值指的是右侧阴影的大小,第二个值指的是下方阴影的大小,第三个值指的是模糊距离(即阴影从开始变淡到完全消失的距离),最后一个值是阴影颜色。
想要最好的浮雕文字效果:不要模糊,不要水平阴影,仅在垂直方向设置1或2像素的“白影”即可。
想要了解W3C对text-shadow属性的标准定义 http://www.w3.org/TR/css3-text/#text-shadow