概述
text-shadow 为文字添加阴影。
- 可以为文字与 text-decorations 添加多个阴影,阴影值之间用逗号隔开。
- 要为每个阴影指定相对文字的偏移量,可选的颜色及模糊半径。
- 多个阴影从前往后叠加,第一个阴影在最前面。
- 可以应用在::first-line和::first-letter伪元素上
语法
text-shadow:offset-x | offset-y | blur-radius | color
- offset-x ,offset-y:必选。这些长度值指定阴影相对文字的偏移量。
- offset-x指定水平偏移量,若是负值则阴影位于文字左边。
- offset-y 指定垂直偏移量,若是负值则阴影位于文字上面。
如果两者均为0,则阴影位于文字正后方(如果设置了 blur-radius 则会产生模糊效果)。
- blur-radius:可选。代表模糊半径,如果没有指定,则默认为0。值越大,模糊半径越大,阴影也就越大越淡
- color:阴影的颜色。可以在偏移量之前或之后指定。
例子
.text-shadow {
text-shadow: rgba(0,0,0,0.5) 0 -2px 2px;
}
多阴影:
.text-shadow {
text-shadow: 1px 1px 2px black, 0 0 1em blue, 0 0 0.2em blue;
}