我正试图用光辉来创造一个月亮.与图像相同.
我已经尝试过但没有太大的成功.
我不想在网站上使用图像.我想用CSS3创建这个.
我的圈子正在创建非常小,并且发光是在小区域.我想要在大半径区域发光
http://jsfiddle.net/naresh_kumar/ezUfG/6/
HTML
<div> <span>Glow</span> </div>
CSS
div { margin: 20px 10px 10px; text-align: center; font-family: sans-serif; } span { display: inline-block; padding-top: 40px; background: whiteSmoke; width: 100px; height: 60px; text-align: center; vertical-align: middle; -webkit-Box-shadow: 0 0 10px #F8A50E; -moz-Box-shadow: 0 0 10px #F8A50E; Box-shadow: 0 0 10px #F8A50E; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; -webkit-transition: Box-shadow .4s ease; -moz-transition: Box-shadow .4s ease; -ms-transition: Box-shadow .4s ease; -o-transition: Box-shadow .4s ease; transition: Box-shadow .4s ease; } span:hover { -webkit-Box-shadow: 0 0 10px red; -moz-Box-shadow: 0 0 10px red; Box-shadow: 0 0 0 10px red; }
解决方法
使用Box-shadow