在 CSS 中旋转元素使用的是 rotate() 函数,这个函数的参数是一个角度值,可以是正值或负值。这里需要注意,角度值不仅可以用数字来表示,也可以使用单位,比如 deg(度)、rad (弧度)和 grad(梯度)。
如果不是很熟悉这三种单位,可以通过以下方式来查看角度值:
.box { transform: rotate(45deg); }
在上面的代码片段中,.box 被旋转了 45 度。这里的关键在于 rotate(45deg) 这个函数,它指定了旋转的角度是 45 度。
如果要旋转 90 度,只需要将代码改成这样:
.box { transform: rotate(90deg); }
在这里使用的是 deg 单位,表示角度,这意味着大家指定的是一个角度值。
如果使用的是 rad 或 grad,那么就需要按照这样的格式来书写:
.box { transform: rotate(1rad); } .box { transform: rotate(10grad); }
上述代码中,第一个是使用 rad 单位表示角度的,第二个是使用 grad 单位表示角度的。
总结一下,使用 CSS 旋转元素时,大家可以使用正值或负值来指定角度,也可以使用 deg、rad 或 grad 这些单位来表示角度。加强思维训练,可以通过一些小的代码片段来练习你的 CSS 知识并加深对旋转角度的理解。