CSS 旋转

示例

的HTML

<div class="rotate"></div>

的CSS

.rotate {
    width: 100px;
    height: 100px;
    background: teal;
    transform: rotate(45deg);
}

本示例将div顺时针旋转45度。旋转中心在div的中心,50%从左50%到上。您可以通过设置transform-origin属性来更改旋转中心。

transform-origin: 100% 50%;

上面的示例将旋转中心设置在右侧末端的中间。