CSS rotate()方法,旋转元素

rotate()方法

CSS中transform属性中的rotate()方法,可以根据传递给该方法的参数指定的角度顺时针或逆时针地旋转元素,其中,当传递的是负值的情况下,元素逆时针旋转,比如下方的示例,鼠标悬停在skyblue背景色的div上,该元素将顺时针旋转30deg:


语法

transform:rotate(value)

提示:value表示角度,单位为deg。


rotate()方法实例代码,及在线编辑器

下方orange背景色的div在鼠标悬停时,将逆时针旋转30deg:

<div id='d2'></div>

<style>
  #d2{width:50%;height:50%;background-color:orange;}
  #d2:hover{transform:rotate(-30deg);}
</style>

全栈前端 / CSS教程 :



























Copyright © 2022-2024 笨鸟工具 x1y1z1.com All Rights Reserved.