CSS参考手册
»
属性列表
»
文本属性
»
相关内容:
其它文本属性参考
选择其它项
text-indent
text-overflow
text-align
text-transform
text-decoration
text-decoration-line
text-decoration-color
text-decoration-style
text-shadow
text-fill-color
text-stroke
text-stroke-width
text-stroke-color
letter-spacing
word-spacing
vertical-align
word-wrap
white-space
direction
unicode-bidi
line-height
tab-size
text-shadow
版本:CSS3
继承性:有
语法:
text-shadow
:none |
<shadow>
[ ,
<shadow>
]*
<shadow>
=
<length>
{2,3} &&
<color>
?
默认值
:
none
取值:
none:
无阴影
<length>
①:
第1个长度值用来设置对象的阴影水平偏移值。可以为负值
<length>
②:
第2个长度值用来设置对象的阴影垂直偏移值。可以为负值
<length>
③:
如果提供了第3个长度值则用来设置对象的阴影模糊值。不允许负值
<color>
:
设置对象的阴影的颜色。
说明:
设置或检索对象中文本的文字是否有阴影及模糊效果。
参阅
box-shadow
属性。
可以设定多组效果,每组参数值以逗号分隔。
对应的脚本特性为
textShadow
。
兼容性:
浅绿
= 支持
红色
= 不支持
墨绿
= 部分支持
橙色
= 实验性质
支持版本
\类型
IE
Firefox
Safari
Chrome
Opera
版本
6.0-9.0
4.0
5.1
13.0
11.50
版本
10.0
示例:
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8" /> <title>text-shadow_CSS参考手册_web前端开发参考手册系列</title> <meta name="author" content="Joy Du(飘零雾雨)" /> <style> .test li{margin-top:10px;} .test .mormal p{text-shadow:1px 1px rgba(0,0,0,.3);} .test .blur p{text-shadow:1px 1px 1px rgba(0,0,0,.3);} .test .group p{text-shadow:1px 1px 0 rgba(255,255,255,1),1px 1px 2px rgba(0,85,0,.8);} </style> </head> <body> <ul class="test"> <li class="mormal"> <strong>普通文字阴影</strong> <p>测试普通文字阴影效果</p> </li> <li class="blur"> <strong>模糊文字阴影效果</strong> <p>测试模糊文字阴影效果</p> </li> <li class="group"> <strong>多重模糊文字阴影效果</strong> <p>测试多重模糊文字阴影效果</p> </li> </ul> </body> </html>