700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > css绘制星星闪烁 CSS3 闪烁的星星

css绘制星星闪烁 CSS3 闪烁的星星

时间:2019-08-12 03:50:38

相关推荐

css绘制星星闪烁 CSS3 闪烁的星星

CSS

语言:

CSSSCSS

确定

body {

background: black;

}

.shine {

background-image: url(/uploads/150601/shine.png);

background-repeat: no-repeat;

background-position: center;

width: 155px;

height: 155px;

position: absolute;

animation: opacity-change 1s ease-in-out infinite;

-webkit-animation: opacity-change 1s ease-in-out infinite;

-moz-animation: opacity-change 1s ease-in-out infinite;

-o-animation: opacity-change 1s ease-in-out infinite;

}

.shine2 {

animation: opacity-change 1.75s ease-in-out infinite;

-webkit-animation: opacity-change 1.75s ease-in-out infinite;

-moz-animation: opacity-change 1.75s ease-in-out infinite;

-o-animation: opacity-change 1.75s ease-in-out infinite;

}

@keyframes opacity-change {

0% {

opacity: 0;

}

50% {

opacity: 1;

}

100% {

opacity: 0;

}

}

@-webkit-keyframes opacity-change {

0% {

opacity: 0;

}

50% {

opacity: 1;

}

100% {

opacity: 0;

}

}

@-moz-keyframes opacity-change {

0% {

opacity: 0;

}

50% {

opacity: 1;

}

100% {

opacity: 0;

}

}

@-o-keyframes opacity-change {

0% {

opacity: 0;

}

50% {

opacity: 1;

}

100% {

opacity: 0;

}

}

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。