变形--旋转 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); }
演示结果
慌慌张张 匆匆忙忙
为何生活总是这样
难道说我的理想
就是这样度过一生的时光
不卑不亢 不慌不忙
也许生活应该这样
难道说六十岁以后
再去寻找我想要的自由
其实我也常对自己说
人要学会知足而常乐
可万事都一笑而过
还有什么意思呢