33.transition-rotate

来源：互联网发布：eclipse java项目结构编辑：程序博客网时间：2024/05/21 08:57

transition-rotate

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Document</title>    <style>            div{                width: 400px;                margin:100px auto;            }            img{                transition:all .5s;            }            img:hover{                transform: rotate(360deg);                /*transform: rotateX(1080deg);                transform: rotateY(1080deg);*/                /*transform: skew(90deg);                transform: skew(90deg);                transform: skewX(50deg);                transform: skewY(50deg);*/                /*transform: scale(1);                transform: scale(2);                transform: scale(-2);                transform: scale(0);                transform: scale(1.5);                transform: scale(2);*/            }    </style></head><body>    <!--         transform              translate(X,Y)            translateX()            translateY()            rotate()   旋转   deg            rotateX()   旋转  deg            rotateY()   旋转  deg            skew        扭曲   deg            skewX       扭曲   deg            skewY       扭曲   deg            scale(num)  中心缩放                        num: ... -2, -1, 0 , 1, 2 ....   系数也可以为小数     -->    <div>        <img src="a.jpg" alt="" width=400   >    </div></body></html>

阅读全文

0 0