css 图片/元素旋转代码

 

<span style="font-size:18px;"><!DOCTYPE html>
<html lang="zh-cn">
<head>
<style>
@keyframes wml {
    from {
    transform:rotate(0);
    -ms-transform:rotate(0);
    -webkit-transform:rotate(0);
    -o-transform:rotate(0);
    -moz-transform:rotate(0)
}
to {
    transform:rotate(360deg);
    -ms-transform:rotate(360deg);
    -webkit-transform:rotate(360deg);
    -o-transform:rotate(360deg);
    -moz-transform:rotate(360deg)
}
}.asd {
    animation:wml 3s linear infinite;
    -moz-animation:wml 3s linear infinite;
    -webkit-animation:wml 3s linear infinite;
    -o-animation:wml 3s linear infinite
}
</style>
</head>
<body>
    <img class="asd" src="http://avatar.csdn.net/5/5/7/1_u013372487.jpg">
</body>
</html>
</span>

from 0  to  360  表示顺时针旋转

from 360  to  0  表示逆时针旋转

3s  表示旋转速度

posted @ 2021-09-22 21:04  小鬼PSer  阅读(261)  评论(0)  编辑  收藏  举报