纯css闪烁效果

.i-i-box-active{
    -webkit-animation: shan666 1s infinite ease-in-out;
    animation: shan666 1s infinite ease-in-out;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

@-webkit-keyframes shan666 {
    0% {
        opacity: 0.5;
        filter: alpha(opacity=20);
        /*-webkit-transform: scale(0.8);*///缩小
    }
    50% {
        opacity: 1;
        filter: alpha(opacity=50);
        /*-webkit-transform: scale(1.12);*///放大
        background-color: red;
        color: #fff;
    }
    100% {
        opacity: 0.5;
        filter: alpha(opacity=20);
        /*-webkit-transform: scale(0.8);*///缩小
    }
}

@keyframes shan666 {
    0% {
        opacity: 0.5;
        filter: alpha(opacity=20);
        /*-webkit-transform: scale(0.8);*///缩小
    }
    50% {
        opacity: 1;
        filter: alpha(opacity=50);
        /*-webkit-transform: scale(1.12);*///放大
        background-color: red;
        color: #fff;
    }
    100% {
        opacity: 0.5;
        filter: alpha(opacity=20);
        /*-webkit-transform: scale(0.8);*///缩小
    }
}

 

转载于:https://www.cnblogs.com/shark1100913/p/11124745.html