参数

2023-07-29T09:04:27.png
2023-07-29T09:18:31.png

效果

screenshots.gif

源码

div{
        width:500px;
        height:500px;
        background-color:blueviolet;

    
        margin:200px auto;


        animation:myAnim 1s linear 0s infinite;


    }


div:hover{
animation-play-state:paused;

}



@keyframes myAnim{


    0%{
width: 200px;
background-color: red;
    }

    25%{
background-color: pink;
width: 300px;
    }
    50%{
background-color: green;
width: 400px;
    }

    70%{
        background-color: orange;
        width: 300px;
    }


    100%{
        background-color: blue;
        width: 200px;
    }

}