首页 > 代码库 > 变形--旋转 rotate()

变形--旋转 rotate()

旋转rotate()函数通过指定的角度参数使元素相对原点进行旋转。它主要在二维空间内进行操作,设置一个角度值,用来指定旋转的幅度。如果这个值为正值,元素相对原点中心顺时针旋转;如果这个值为负值,元素相对原点中心逆时针旋转。如下图所示:

技术分享

 

HTML代码:

<div class="wrapper">

  <div></div>

</div>

CSS代码:

.wrapper {

  width: 200px;

  height: 200px;

  border: 1px dotted red;

  margin: 100px auto;

}

.wrapper div {

  width: 200px;

  height: 200px;

  background: orange;

  -webkit-transform: rotate(45deg);

  transform: rotate(45deg);

}

演示结果

 

技术分享

 

 

 

变形--旋转 rotate()