text-shadow_CSS
- 普通文字阴影
测试普通文字阴影效果
- 模糊文字阴影效果
测试模糊文字阴影效果
- 多重模糊文字阴影效果
测试多重模糊文字阴影效果
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8" />
<title>text-shadow_CSS</title>
<meta name="author" content="" />
<meta name="copyright" content="" />
<style>
/*
text-shadow:
1. length : 第1个长度值用来设置对象的阴影水平偏移值。可以为负值
2. length: 第2个长度值用来设置对象的阴影垂直偏移值。可以为负值
3. length: 如果提供了第3个长度值则用来设置对象的阴影模糊值。不允许负值
4. color: 设置对象的阴影的颜色。
*/
.test li{margin-top:10px;}
.test .mormal p{text-shadow:1px 1px rgba(0,0,0,.3);}
.test .blur p{text-shadow:1px 1px 2px 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>