如何让让图片一直做动画？

 

1.360度一直旋转动画

 

<img  class="rotate"  src="../circle.png"/>

.rotate {

    transform: rotate(360deg);

    animation: rotation 3s linear infinite;

    -moz-animation: rotation 3s linear infinite;

    -webkit-animation: rotation 3s linear infinite;

    -o-animation: rotation 3s linear infinite;

}

@keyframes rotation {

    from {-webkit-transform: rotate(0deg);

}

to {

    -webkit-transform: rotate(360deg);

}

}

2.放大动画

<img  class="ballon"  src="../circle.png"/>

@keyframes scaleDraw { 

    0%{

        transform: scale(1);

        opacity:1;  

    }

    100% {

        transform: scale(1.3); 

        opacity:0.4;

    }

    

}

.ballon{

    animation-name: scaleDraw; 

    animation-timing-function: ease-in-out; 

    animation-iteration-count: infinite;  

    animation-duration: 2s; 

        

}