1500字范文,内容丰富有趣,写作好帮手!
1500字范文 > css3实现星星闪烁效果

css3实现星星闪烁效果

时间:2019-06-26 08:26:05

相关推荐

css3实现星星闪烁效果

独角兽企业重金招聘Python工程师标准>>>

素材:

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title></head><style>body {background: black;}.shine {background-image: url(./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;}}</style><body><div class="shine shine2"><h2>闪烁的星星</h2></div></body></html>

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