2D转换之旋转——rotate的用法
首先,我们给一张图片作为研究对象,在这里,需要给出图片的储存路径,示例代码如下:
<body>
<img src="E:\HTML+CSS\案例\media\1006.jpg" alt="">
</body>
其中E:\HTML+CSS\案例\media\1006.jpg
是我本地储存该图片的路径。
现在,我们用rotate来进行图片旋转
rotate进行进行旋转的规则的为:
rotate( deg)
若rotate
所接( deg)为正值,则顺时针旋转;若rotate所接( deg)为负值,则逆时针旋转。(deg表示角度的单位)。
eg:
假设,我们想使图片顺时针旋转45度,则代码为transform: rotate(45deg);
现在,我们运用rotate做一个鼠标碰到的旋转动画:
<style>
img: {
width