css3图片原地旋转

CSS3可以通过transform属性来实现图片的原地旋转，可以实现让图片不断旋转的效果。

img {
    -webkit-transform: rotate(180deg); /* Safari */
    -moz-transform: rotate(180deg); /* Firefox */
    -ms-transform: rotate(180deg); /* IE */
    -o-transform: rotate(180deg); /* Opera */
    transform: rotate(180deg);
}

在代码中使用transform属性对图片进行旋转，并使用角度值指定旋转的角度，这里是180度。

img {
    -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin 2s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
    }
}

/* 标准语法 */
@keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

这里是通过CSS3动画来实现图片不断旋转的效果，可以指定动画名称、时间、运动曲线和动画是否重复等。

总的来说，使用CSS3可以很方便地实现图片的原地旋转效果，可以让网页更加生动有趣。