3D转换transform

rotateX() 方法

rotateX()方法,围绕其在一个给定度数X轴旋转的元素。

div
{
transform: rotateX(120deg);
-webkit-transform: rotateX(120deg); /* Safari 与 Chrome */
}

rotateY() 方法

rotateY()方法,围绕其在一个给定度数Y轴旋转的元素。

div
{
transform: rotateY(130deg);
-webkit-transform: rotateY(130deg); /* Safari 与 Chrome */
}

转换属性

下表列出了所有的转换属性:

3D 转换方法

【Demo】CSS3 3D转换的更多相关文章

  1. CSS3 3D转换

    CSS3允许你使用3D转换来对元素进行格式化. 3D转换方法: rotateX() rotateY() 浏览器支持 属性 浏览器支持 transform           IE10和Firefox支 ...

  2. CSS3 3D 转换

    CSS3 允许您使用 3D 转换来对元素进行格式化. 在本章中,您将学到其中的一些 3D 转换方法: rotateX() rotateY() rotateX() 方法 rotateX()方法,围绕其在 ...

  3. CSS3 3D转换——rotateX(),rotateY(),rotateZ()

    CSS3 允许使用 3D 转换来对元素进行格式化. ㈠浏览器支持 Internet Explorer 10 和 Firefox 支持 3D 转换. Chrome 和 Safari 需要前缀 -webk ...

  4. css3 2d转换3d转换以及动画的知识点汇总

    css3 2d转换 2d转换的方法: 1.移动 translate(x, y) 可以改变元素的位置,x.y可为负值: 2.缩放 scale(x, y) 可以对元素进行水平和垂直方向的缩放,x.y的取值 ...

  5. HTML CSS3中2D转换、3D转换、过渡效果总结

    一.CSS3 2D转换 通过 CSS3 转换,我们可以对元素进行移动.缩放.转动.拉长或拉伸. 特别注意,我们在使用css3动画效果时,必须给他们加相应的浏览器前缀,以便浏览器识别,让我们更好的去应用 ...

  6. css3 3d特效汇总

    本篇全是实战,没有基础,如果不明白3d特效的原理,可能会看不懂,不过没关系,给你推荐一下 张鑫旭css3 3d转换,或者看我的另一篇博客  css3 2d转换3d转换以及动画的知识点汇总,看完这些3d ...

  7. CSS3 基本属性 浅析(含选择器、背景阴影、3D转换、动画等)

    1渐进增强原则 2私有前缀  不同浏览器在发布不同版本(一般测试版)时会加前缀,新增属性加上前缀进行支持测试:     Chrome浏览器:-webkit-border-radius: 5px;   ...

  8. CSS3常用属性(边框、背景、文本效果、2D转换、3D转换、过渡、有过渡效果大图轮播、动画)

    CSS3边框: 1.CSS3圆角:border-radius  属性--创建边框线的圆角 <body style="font-size:24px; color:#60F;"& ...

  9. CSS笔记(十二)CSS3之2D和3D转换

    参考:http://www.w3school.com.cn/css3/css3_2dtransform.asp 2D Transform 方法 函数 描述 matrix(n,n,n,n,n,n) 定义 ...

随机推荐

  1. font-size引起的页面晃动

    如下图中的场景,页面分为头和内容两个大块,head高度是50PX,1PX的border,中间的内容是iframe,高度需要每次进行计算,如下 <script>$(function(){ s ...

  2. PHP 安装memcache.so 和memcached.so

    一.memcache.so 的安装 wget http://pecl.php.net/get/memcache-2.2.7.tgztar zxvf memcache-2.2.7.tgz./config ...

  3. 000 初步使用Kotlin开发Android应用

    Kotlin是Jetbrians公司开发的一款编程语言,基于jvm兼容Java. 要求 IDE:IDEA或者Android Studio(简称studio)对Kotlin语言有所了解,官方文档:htt ...

  4. phpexcel导出带生成图片完美案例

    // 导出exl public function look_down(){ $id = I('get.id'); $m = M ('offer_goods'); $where['offer_id'] ...

  5. python爬取当当网的书籍信息并保存到csv文件

    python爬取当当网的书籍信息并保存到csv文件 依赖的库: requests #用来获取页面内容 BeautifulSoup #opython3不能安装BeautifulSoup,但可以安装Bea ...

  6. Java集合(5):HashSet

    存入Set的每个元素必须是惟一的,因为Set不保存重复元素.加入Set的元素必须定义equals()方法以确保对象的唯一性.Set不保证维护元素的次序.Set与Collection有完全一样的接口. ...

  7. IE调试页面总结

    随着IE版本的升级,IE变的越来越强大,随之带来的问题也是越来越明显,如:如何调试在低版本的浏览器中 的情况 IE9的方法: 出于未知需求,用户在安装了较高版本IE浏览器(IE9)之后,又需要使用低版 ...

  8. JAVA实现redis超时失效key 的监听触发

    过期事件通过Redis的订阅与发布功能(pub/sub)来进行分发. 而对超时的监听呢,并不需要自己发布,只有修改配置文件redis.conf中的:notify-keyspace-events Ex, ...

  9. django---ORM之Q查询

    filter 等方法中的关键字参数查询都是一起进行“AND” 的. 如果你需要执行更复杂的查询(例如OR 语句),你可以使用Q对象 调用Q from django.db.models import Q ...

  10. hydra简单使用示例

    本内容为网上收集整理,仅作为备忘!! hydra简单使用示例: 破解https: # hydra -m /index.php -l muts -P pass.txt 10.36.16.18 https ...