我按着这样写了 但是我的灯笼怎么闪不了??

来源:3-8 移动端项目开发——特效

我啊我诶

2016-02-08 21:42

是代码哪里有问题吗?我看了好久 还是没发现

#page1 >.p1_lantern:before{

position:absolute;

/*z-index:-1;  这句我写了过后效果就看不见了 所以就没写*/

content:"";

top:0;

right:0;

bottom:0;

left:0;

margin:auto;

width:30vw;

height:30vw;

background:#d60b3b;

opacity:.5;

-webkit-box-shadow:0 0 10vw 10vw #d60b3b;

  -moz-box-shadow:0 0 10vw 10vw #d60b3b;

   -ms-box-shadow:0 0 10vw 10vw #d60b3b;

    -o-box-shadow:0 0 10vw 10vw #d60b3b;

         box-shadow:0 0 10vw 10vw #d60b3b;

border-radius:50%;

-webkit-animation: p1_lantern .5s infinite alternate;

animation: p1_lantern .5s infinite alternate;

@-webkit-keyframes p1_lantern {

0% {

opacity: .5;

-webkit-transform: scale(.8, .8);

transform: scale(.8, .8);

}

100% {opacity: 1;}

}

@keyframes p1_lantern {

0% {

opacity: .5;

-webkit-transform: scale(.8, .8);

transform: scale(.8, .8);

}

100% {opacity: 1;}

}

}


写回答 关注

2回答

  • 李晓健
    2016-02-16 14:55:43
    已采纳

    @-webkit-keyframes p1_lantern 和 @keyframes p1_lantern  应该写到 #page1 >.p1_lantern:before{ } 的外面,你写到里面去了

    我啊我诶

    非常感谢!

    2016-02-16 21:34:05

    共 1 条回复 >

  • 大黄蜂f
    2016-02-12 12:20:16

    浏览器不兼容呗  换几个高级浏览器试试

    我啊我诶

    不行啊 用的chrome和Firefox都不行

    2016-02-14 21:18:27

    共 1 条回复 >

HTML5+CSS3实现春节贺卡

又逢新春佳节,春节贺卡搞起来,学会HTML5+CSS3实现春节贺卡

110036 学习 · 450 问题

查看课程

相似问题