今天总结一下文字特效text-shadow，如果用好它可以做出各种不一样的效果，下图是我做出的几种效果。
怎么样，看起来很不错吧，下面贴代码。
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
/* css */
p{
width:300px;
margin:0 auto;
background:#e9e9e9;
padding:30px 0;
font-size:30px;
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;
text-align:center;
}
.a1{
color:#fff;
text-shadow:0 0 5px #99FFFF,
0 0 15px #99FFFF,
0 0 25px #99FFFF;
}
.a2{
text-shadow:0 0 5px #30C;
color:transparent;
}
.a3{
text-shadow:-1px -1px 0 #fff, 1px 1px 0 #000;
}
.a4{
color:#fff;
text-shadow:1px 0px 0 #60F,
0px 1px 0 #60F,
-1px 0px 0 #60F,
0px -1px 0 #60F;
}
.a5{
color:#fff;
text-shadow:0px 1px 0 #000,
0px 2px 0 #333,
0px 3px 0 #060606,
0px 4px 0 #020202,
0px 5px 0 #252525,
0px 6px 1px rgba(0,0,0,0.5),
0px 5px 4px rgba(0,0,0,0.7),
0px 2px 6px rgba(0,0,0,0.6);
}
<!--html-->
<div class="main">
<p class="a1">发光</p>
<p class="a2">模糊</p>
<p class="a3">浮雕</p>
<p class="a4">描边</p>
<p class="a5">立体</p>
</div>
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
