html5 css3舞台灯光,HTML5特效库 CSS3 实现灯光照射显示文字动画源码

效果图

各位朋友，大家好！

今天给大家带来的特效源码是 CSS3 实现灯光照射显示文字动画源码

是不是很炫酷，大家可以按照自己的想法进行修改！

有想要文件版源码的可以私聊我

废话不多说，上源码！

CSS：

body {background: #000;}

.content {position: relative;width: 750px;margin: 0 auto;}

p {margin: 0;padding: 0;font-size: 90px; }

.klam {

position: absolute;

top: 40px;

left: 100px;

color: #000;

z-index: 1;

animation: shadow 5.0s ease-in-out infinite;

}

.noor {

position: absolute;

top: 30px;

left: 50px;

width: 140px;

height: 140px;

opacity: 0.8;

border-radius: 100px;

z-index: 0;

background:

-webkit-radial-gradient(center, ellipse cover, #fff 0%, rgba(255,

255, 255, 0.2) 100%);

box-shadow: 0px 0px 50px #fff;

animation: noor 5.0s ease-in-out infinite;

}

.two {z-index: 2;opacity: 0.8;}

@-webkit-keyframes noor {

0% {left: 45px;}

50% {left: 335px;}

75%{left:500px;}

100% {left: 45px;}

}

@-webkit-keyframes shadow {

0% {text-shadow: -9px 1px 4px #000;}

50% {text-shadow: 9px 1px 4px #000; }

100% {text-shadow: -9px 1px 4px #000;}

}

license