html字体阴影实例,CSS_举例详解CSS中的text-shadow文字阴影效果使用，text-shadow 语法 CSS Code复制内 - phpStudy...

举例详解CSS中的text-shadow文字阴影效果使用

text-shadow

语法

CSS Code复制内容到剪贴板

text-shadow: h-shadow v-shadow blurcolor;

实例

基础的文本阴影效果：

CSS Code复制内容到剪贴板

{

text-shadow:5px5px5px#FF0000;

}

Eg:

CSS Code复制内容到剪贴板

{text-shadow: h-shadow v-shadow blurcolor;}

附：E即Element，元素的意思。

兼容IE的写法：

滤镜语法：

Eg:

CSS Code复制内容到剪贴板

{filter:shadow(Color=颜色值,Direction=数值,Strength=数值)}

Direction用于设定投影的主向，取值为0即零度(表示向上方向)，45为右上，90为右，135为右下，180为下方，225为左下方，270为左方，315为左上方；Strength就是强度，类似于text-shadow中的blur值。

text-shadow的实例 CSS代码：

CSS Code复制内容到剪贴板

.demo {

background:#666666;

width:224px;

padding:30px;

font:bold55px/100%"Lucida Sans";

color:#fff;

text-transform:uppercase;

text-shadow:red02px0;

}

HTML代码：

XML/HTML Code复制内容到剪贴板

梦龙小站