CSS3 3D 转换
2016-01-23 00:00
225 查看
摘要: CSS3 3D 转换
在本章中,您将学到其中的一些 3D 转换方法:
rotateX()
rotateY()
点击下面的元素,来查看 2D 转换与 3D 转换之间的不同之处:
2D rotate
3D rotate
Internet Explorer 10 和 Firefox 支持 3D 转换.
Chrome 和 Safari 必须添加前缀 -webkit-.
Opera 还不支持 3D 转换(支持 2D 转换 ).
rotateX()方法,围绕其在一个给定度数X轴旋转的元素。
rotateY()方法,围绕其在一个给定度数Y轴旋转的元素。
原文地址:http://www.phplearn.cn/css3/css3-3dtransforms.html
3D Transforms
CSS3 允许您使用 3D 转换来对元素进行格式化。在本章中,您将学到其中的一些 3D 转换方法:
rotateX()
rotateY()
点击下面的元素,来查看 2D 转换与 3D 转换之间的不同之处:
2D rotate
3D rotate
浏览器支持
Internet Explorer 10 和 Firefox 支持 3D 转换.
Chrome 和 Safari 必须添加前缀 -webkit-.
Opera 还不支持 3D 转换(支持 2D 转换 ).
rotateX() 方法
rotateX()方法,围绕其在一个给定度数X轴旋转的元素。
div { transform: rotateX(120deg); -webkit-transform: rotateX(120deg); /* Safari and Chrome */ }
rotateY() 方法
rotateY()方法,围绕其在一个给定度数Y轴旋转的元素。
div { transform: rotateY(130deg); -webkit-transform: rotateY(130deg); /* Safari and Chrome */ }
原文地址:http://www.phplearn.cn/css3/css3-3dtransforms.html
相关文章推荐
- CSS3 过渡
- CSS3 动画
- innerHTML和nnerText造成的乱码现象 以及 background-image放入.css中失效
- 使用HTML 和CSS 开发商业站点
- CSS3中的pointer-events
- 我就是要用css实现
- CSS之盒模型
- koala编译scss文件时不支持中文字体的解决方案
- 【CSS 未完】牛客网试题总结1 ?
- css垂直居中
- css样式
- css3—实现3D特效
- 一个css和js结合的下拉菜单,支持主流浏览器
- 你所不知的 CSS ::before 和 ::after 伪元素用法
- 通过css的before和after制作按钮的动画效果
- css3中outline切换动画效果
- css笔记——杂记
- OOCSS的概念和思路
- CSS各种居中布局方法汇总
- css的div垂直居中的方法,百分比div垂直居中