这是一款效果非常炫酷的css3火焰文字特效。该css3火焰文字特效仅用10行代码就可以实现,效果特别炫酷。
使用方法
HTML结构
使用任意元素来包裹要实现火焰文字特效的文字。
<span class="text-effect">jQuery之家</span>
CSS3
然后通过下面的CSS代码来实现文字的火焰特效。
.text-effect{ display: block; font-size: 130px; color: #fff; text-align: center; text-shadow: 0px -1px 4px white, 0px -2px 10px yellow, 0px -10px 20px #ff8000, 0px -18px 40px red; position: relative; } @media only screen and (max-width: 990px){ .text-effect{ font-size: 100px; } } @media only screen and (max-width: 767px){ .text-effect{ font-size: 80px; } } @media only screen and (max-width: 479px){ .text-effect{ font-size: 50px; } }