第24节CSS3转换.PPTVIP

传媒学院 传媒学院 传媒学院 第24节 CSS3转换 武汉纺织大学传媒学院 cm.wtu.edu.cn * * 传媒学院 转换是css3引入的一个属性 transform 通过 CSS3 转换，能够对元素进行移动、缩放、转动、拉长或拉伸 转换是使元素改变形状、尺寸和位置的一种效果 可以使用 2D 或 3D 转换来转换网页中的元素 支持浏览器 Internet Explorer 10、Firefox支持 transform 属性 Chrome 和 Safari 需要前缀-webkit- 1.转换属性 * * 传媒学院 转换方法 translate() 移动 rotate() 旋转 scale() 缩放 skew() 翻转 rotateX() 3D旋转 rotateY() 3D旋转 使用语法 transform: rotate(30deg); 2.转换方法 * * 传媒学院 通过 translate() 方法，元素从其当前位置移动到给定的 left（x 坐标） 和 top（y 坐标） 位置 例子 transform: translate(50px,100px); -webkit-transform: translate(50px,100px); 表示移动到x坐标50px，y坐标100px的位置 3.translate * * 传媒学院 使用transform的 transl