div
{
  transform:rotate(7deg);
  -ms-transform:rotate(7deg); /* IE 9 */
  -moz-transform:rotate(7deg); /* Firefox */
  -webkit-transform:rotate(7deg); /* Safari 和 Chrome */
  -o-transform:rotate(7deg); /* Opera */
}

语法: transform: none|transform-functions;

none 定义不进行转换。 测试
matrix(n,n,n,n,n,n) 定义 2D 转换,使用六个值的矩阵。 测试
matrix3d(n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n) 定义 3D 转换,使用 16 个值的 4x4 矩阵。
translate(x,y) 定义 2D 转换。 测试
translate3d(x,y,z) 定义 3D 转换。
translateX(x) 定义转换,只是用 X 轴的值。 测试
translateY(y) 定义转换,只是用 Y 轴的值。 测试
translateZ(z) 定义 3D 转换,只是用 Z 轴的值。
scale(x,y) 定义 2D 缩放转换。 测试
scale3d(x,y,z) 定义 3D 缩放转换。
scaleX(x) 通过设置 X 轴的值来定义缩放转换。 测试
scaleY(y) 通过设置 Y 轴的值来定义缩放转换。 测试
scaleZ(z) 通过设置 Z 轴的值来定义 3D 缩放转换。
rotate(angle) 定义 2D 旋转,在参数中规定角度。 测试
rotate3d(x,y,z,angle) 定义 3D 旋转。
rotateX(angle) 定义沿着 X 轴的 3D 旋转。 测试
rotateY(angle) 定义沿着 Y 轴的 3D 旋转。 测试
rotateZ(angle) 定义沿着 Z 轴的 3D 旋转。 测试
skew(x-angle,y-angle) 定义沿着 X 和 Y 轴的 2D 倾斜转换。 测试
skewX(angle) 定义沿着 X 轴的 2D 倾斜转换。 测试
skewY(angle) 定义沿着 Y 轴的 2D 倾斜转换。 测试
perspective(n) 为 3D 转换元素定义透视视图。 测试

transform旋转变换效果的更多相关文章

  1. transform动画效果

     transform动画效果 transform :移动,旋转.倾斜.缩放.     transform:translate(0,300px); x代表的是水平的偏移距离,y代表垂直的.      t ...

  2. css3 transform动画效果与公司框架简易动画的差异

    先看一下该网站的效果 http://2014guangzhouchezhan.dongfeng-citroen.com.cn/mobile/ 该站里面的动画效果由简易动画与css3动画2种方式混合达到 ...

  3. transform 动画效果

    http://www.css88.com/tool/css3Preview/Transform.html transform的含义是:改变,使…变形:转换 transform的属性包括:rotate( ...

  4. 携程transform放大效果

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. CSS3 3D立方体效果-transform也不过如此

    CSS3系列已经学习了一段时间了,第一篇文章写了一些css3的奇技淫巧,原文戳这里,还获得了较多网友的支持,在此谢过各位,你们的支持是我写文章最大的动力^_^. 那么这一篇文章呢,主要是通过一个3D立 ...

  6. NGUI Tween动画Scale与Transform冲突

    NGUI中我们要同时完成Scale与Transform的效果,会发现动画并不是同我们想的那样运行的. 原因就是Tween Scale与Tween Transform的冲突调用. Tween Scale ...

  7. Canvas transform浅析

    没有前奏,直接进入主题 transform调用方法: ctx.transform(a,b,c,d,e,f);如下 var ctx = document.getElementById("myC ...

  8. transform的2D部分,嗯…就这个标题了。

    上一次写了transition的内容,这次就写拼写很类似的另外一个属性transform好了……我英语差这件事就不要吐槽了,下面是正文,真的: transition是过渡,transform是变换. ...

  9. Silverlight 中MatrixTransform和其他Transform的数值转换

    对各种transform的讲解已经很多了,但是有时MatrixTransform和其他transform变换效果之间需要转换时,变换量的转换又如何呢?下面的类就完成了Matrix和其他transfor ...

随机推荐

  1. 企业搜索引擎开发之连接器connector(二十六)

    连接器通过监视器对象DocumentSnapshotRepositoryMonitor从上文提到的仓库对象SnapshotRepository(数据库仓库为DBSnapshotRepository)中 ...

  2. 个人整理的一些iOS Entitlements

    收集了不少Entitlement,当然也肯定有遗漏.有的就是key的字面意思,就不多做解释.不过有的虽然字面意思好理解,不过具体的用处不太清楚,就写的Unknown use.在替换entitlemen ...

  3. EBS单实例上所有正在运行的并发请求以及请求目前的状态

    --EBS单实例上所有正在运行的并发请求以及请求目前的状态---一个实例上运行的所有并发请求的总结和他们目前的状态以及等待状态    select w.seconds_in_wait "Se ...

  4. How To Make A DFF Read Only Through Form Personalisations? (文档 ID 1289789.1)

    In this Document   Goal   Solution   References APPLIES TO: Oracle Application Object Library - Vers ...

  5. 咏南中间件增加WEBSOCKET支持

    咏南中间件增加WEBSOCKET支持

  6. Android-有序广播是可以中断的

    在之前的博客,Android-广播概念,中介绍了(广播和广播接收者)可以组件与组件之间进行通讯,有两种类型的广播(无序广播 和 有序广播),这篇博客就来讲解有序广播的代码实现: 有序广播:接收者 可以 ...

  7. Flask数据库

    一 数据库的设置 Web应用中普遍使用的是关系模型的数据库,关系型数据库把所有的数据都存储在表中,表用来给应用的实体建模,表的列数是固定的,行数是可变的.它使用结构化的查询语言.关系型数据库的列定义了 ...

  8. 构建命令maven install 打包不是最新的代码

    问题: 之前一直用的是mvn install 命令来构建项目,但是最近发现最新的代码没有在war包中.之前看的说 mvn install 命令会执行之前的所有阶段,会被编译,测试,打包. 经查最后采用 ...

  9. sql数据库 大小查询

    select * from sys.master_files where name='CODA_PRD_Catalog' 12416*8/1024=(m)

  10. MaxScript粒子流塌陷

    也是帮网友写的.不过最后没用上.哈哈. targetPF = $ startTime = AnimationRange.Start.Frame endTime = AnimationRange.End ...