CSS3制作炫酷的自定义发光文字

本文为大家分享一款基于纯CSS3的文字发光特效，当我们将鼠标滑过文字时，文字就会模拟发光动画，展现出非常酷的发光画面。另外，由于引用了特殊字体，所以整个文字效果看起来有着3D立体的特效，如果你的网络无法加载这些字体，可能是由于国外的这个网站被墙的缘故，就像google的字体库网址被屏蔽那样。

HTML代码

1. <div id="container">  
2.   
3.   <p><a href="#">  
4.     RED   
5.   </a></p>  
6.   
7.   <p><a href="#">  
8.     BLUE   
9.   </a></p>  
10.   
11.   <p><a href="#">  
12.     Yellow   
13.   </a></p>  
14.   
15.   <p><a href="#">  
16.     GREEN   
17.   </a></p>  
18.   
19.   <p><a href="#">  
20.     ORANGE   
21.   </a></p>  
22.   
23.   <p><a href="#">  
24.     VIOLET   
25.   </a></p>  
26.   
27. </div>  
28.   

CSS代码

1. /*setup*/  
2. *{   
3.   margin: 0;   
4.   padding: 0;   
5. }   
6.   
7. @font-face {   
8.   font-family: 'Monoton';   
9.   font-style: normal;   
10.   font-weight: 400;   
11.   src: local('Monoton'), local('Monoton-Regular'), url(http://themes.googleusercontent.com/static/fonts/monoton/v4/AKI-lyzyNHXByGHeOcds_w.woff) format('woff');   
12. }   
13.   
14. @font-face {   
15.   font-family: 'Iceland';   
16.