概述：css3中的transform中有旋转，放缩，倾斜，平移的功能，分别对应的属性是：rotate，scale，skew，translate
1、旋转，利用rotate来实现，代码如下：
-webkit-transform:rotate(10deg)指定浏览器内核为webkit的翻转方式
-moz-transform:rotate(10deg)指定firefox浏览器私有属性
transform:rotate(10deg)一般浏览器翻转的角度为10弧度
2、 翻转，利用scale来实现，代码如下：
scale本来是放缩的意思，原来括弧里面（1，1）前者表示X轴，后者表示Y轴，当数字大于1时放大，大于0并小于1时缩小，负数代表翻转
水平翻转：
-webkit-transform:scale(-1，1)水平轴为-1，代表水平翻转
-moz-transform:scale(-1，1)水平轴为-1，代表水平翻转
transform:scale(-1，1)水平轴为-1，代表水平翻转
垂直翻转：
-webkit-transform:scale(1，-1)垂直轴为-1，代表垂直翻转
-moz-transform:scale(1，-1)垂直轴为-1，代表垂直翻转
transform:scale(1，-1)垂直轴为-1，代表垂直翻转
使用css3 属性方法 rotate() 实现旋转
transform-origin是规定如何旋转
: center center；为以围绕中心点旋转；
top left以围绕左上角旋转；
top right以围绕右上角旋转；
鼠标经过文字发生翻转变色，可以用css3实现效果：
1，利用css3的rotate(<angle>) 实现文字翻转，其中angle是指旋转角度，如果设置的值为正数表示顺时针旋转，如果设置的值为负数，则表示逆时针旋转。如transform:rotate(30deg):
2，直接定义color即可实现文字变色效果。
所以假设导航上文字的class为nav，则鼠标经过效果的css可以这样写：
.nav hover{transform:rotate(30deg)color:red}
这样写的效果就是，当鼠标经过是，文字顺时针旋转30度，文字颜色变为红色。
