一、动画效果 Transform字面上就是变形,改变的意思,在css3中transform主要包括以下几种: 选转 rotate,扭曲 skew 缩放 scale 和移动translate 以及矩形变形 matrix 。下面我们一起看看css3中transform 的旋转 rotate 扭曲 skew 缩放 scale 和移动Translate 例子: 语法 transform:none|||* 等价于 transform:rotate|scale|skew|translate|matrix; none:表示不进么变换 表示一个或多个变换函数 ,以空格分开 :换句话说就是我们同时对一个元素进行Transform的多种属性操作,例如rotate、scale、translate三种 但这里需要提醒大家的,以往我们叠加效果都是用逗号隔开,但Transform中使用多个属性时却需要有空格隔开。大家记住了是空格隔开 旋转 rotate():通过指定的角度参数对元素指定一个2Drotation(2D旋转),需先有Transform-origin属性的定义。transform-origin定义的是旋转的基点,其中angle是指旋转角度,如果设置为正数表示顺时针旋转。如果设置的值是负数,则表示逆时针旋转,如果Transform:rotate(30deg) -ms-Transform:rotate(7deg) -ms代表ie内核识别码 -moz-transform:rotate(7deg)-moz代表火狐内核识别码 -webkit-Transform:rotate(7deg)-webkit代表谷歌内核识别码 -o-transform:rotate(7deg)-o 代表欧朋【opera】内核识别码 transform:rotate(7deg) 统一表示语句,最好这句话也写下去 符合w3c标准