给自己的网站添加logo闪光特效

/**logo闪光效果CSS**/
.此处改为你logo的类名或者id名{
 position: relative;
 overflow: hidden;
 float:left;
 max-height: 50px;
}
.此处改为你logo的类名或者id名:before {
 left:-1000px;
 top:-1000px;
 content: "";
 position: absolute;
 width: 150px;
 height: 10px;
 background-color: rgba(255, 255, 255, 0.5);
 -webkit-transform: rotate(-45deg);
 transform: rotate(-45deg);
 -webkit-animation: blink 3s ease-in 1s infinite;
 animation: blink 3s ease-in 1s infinite;
}
 
@-webkit-keyframes blink {
 from {left: 10px;top: 0;}
 to {left: 320px;top: 0;}
}
@-o-keyframes blink {
 from {left: 10px;top: 0;}
 to {left: 320px;top: 0;}
}
@-moz-keyframes blink {
 from {left: 10px;top: 0;}
 to {left: 320px;top: 0;}
}
@keyframes blink {
 from {left: -100px;top: 0;}
 to {left: 320px;top: 0;}
}

两处地方需要修改为自己logo的元素id名或者class名

© 版权声明
THE END
喜欢就支持一下吧
点赞10赞赏
分享
评论 抢沙发