So erzielen Sie den Animationseffekt der Bilddrehung in HTML5

In diesem Artikel wird hauptsächlich der Animationseffekt von HTML5 vorgestellt, um die Bildrotation zu erreichen. Freunde, die sie benötigen, können sich darauf beziehen

1 Schauen Sie sich zuerst den Effekt an:

2. Der Code sieht so aus:

<img src="images/circle.png" alt="" id="circle"/>
@mixin ani-btnRotate{
    @keyframes btnRotate{
        from{transform: rotateZ(0);}
        to{transform: rotateZ(360deg);}
    }
}
@include ani-btnRotate;
#circle{
    position: absolute;
    left: 50%;
    width: REM(338);
    height:  REM(338);
    margin-top: REM(200);
    margin-left: REM(-338/2);
    transform-origin: center center ;
    animation: btnRotate 1s 1s linear forwards;
    }

verwendet Das Bild von Bitte achten Sie auf den Inhalt der chinesischen PHP-Website!

unter Verwendung von HTML5 So zeichnen Sie Polygone wie Dreiecke und Rechtecke mit Canvas

Das obige ist der detaillierte Inhalt vonSo erzielen Sie den Animationseffekt der Bilddrehung in HTML5. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!