本帖最后由 陈伟豪 于 2016-12-15 15:30 编辑
CSS3-会呼吸的灯
效果图：
步骤一： 写好结构；div是这个小灯
步骤二： 清除默认样式；给body设置一个灰色的背景，为的是等下做灯的时候好看。
步骤三： 给这个div；设置相应宽高、边框、椭圆属性；设置阴影的值设置小一点，此时样式看不太清楚，为的是等下做动画会有个扩散；最后那条是设置div的背景颜色，这里选择了一个正常渐变色，从#ffc0cb过渡到#ff69b4颜色；此时设置完如下：
步骤四： 设置动画，从0.2透明度、带有阴影过渡到动画完成变成透明度1、加上边框颜色、阴影大点，有个扩散的感觉。
步骤五： 最后再div的CSS属性里添加上刚才设置的动画一直执行。一次的执行时间是2.5秒。
| 
收藏
淘帖
踩
