CSS3中rotate的作用

一。CSS3中的transform（旋转）允许您翻转，旋转，缩放和倾斜元素。
transform(旋转)是一种让元素更改形状，大小和位置的效果。
CSS3支持2D和3D转换。

例子：

    


    
w3cschool

transition可以有以下值：
ease-动画开始缓慢，然后加速（此为default默认值）
ease-in:缓步开始，然后加速，突然停止。
ease-out：快速启动，但减速停止。
ease-in-out:类似与缓冲，但更加微妙的加速和减速。
linear：匀速转换。

顺便说一下贝塞尔曲线，英文全称为（cubiz-bezier），cubiz-bezier（）函数，它允许你在cubiz-bezier函数中定义你自己的值，值从0到1.
代码格式如下：
transition-timing-fucntion:cbiz-bezier(0,0,1,1);
因为这个函数较为复杂，本人又比较菜，所以有兴趣的同学可以去百度一下。

二。CSS3中的transform:rotate（），当rotate()中的值为正值时，顺时针旋转。
当rotate()中的值为负值时，逆时针旋转。
例子如下：

div.positive{
width:200px;
height:100px;
margin-top:30px;
background-color:red;
transform:rotate(10deg);
}
div.negative{
width:200px;
height:100px;
margin-top:30px;
background-color:red;
transform;rotate(-10deg);
}