您的位置:首页 > Web前端 > CSS

CSS3的高级特性

2015-12-07 16:10 513 查看

在开发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
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: