CSS3允许您使用3D转换来对元素进行格式化
那么下面我们一起看一下2D和3D有什么不同：[请用鼠标放到下面两个盒子上，查看效果]/*.dd{width:200px;height:200px;display:inline-block;border:1pxsolidyellow;background:red;}div-2d:hover{transform:rotate(360deg);}div-3d:hover{transform:rotateY(360deg);}*/
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转换方法函数描述matrix3d(n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n)定义3D转换，使用16个值的4x4矩阵。translate3d(x,y,z)定义3D转化。translateX(x)定义3D转化，仅使用用于X轴的值。translateY(y)定义3D转化，仅使用用于Y轴的值。translateZ(z)定义3D转化，仅使用用于Z轴的值。scale3d(x,y,z)定义3D缩放转换。scaleX(x)定义3D缩放转换，通过给定一个X轴的值。scaleY(y)定义3D缩放转换，通过给定一个Y轴的值。scaleZ(z)定义3D缩放转换，通过给定一个Z轴的值。rotate3d(x,y,z,angle)定义3D旋转。rotateX(angle)定义沿X轴的3D旋转。rotateY(angle)定义沿Y轴的3D旋转。rotateZ(angle)定义沿Z轴的3D旋转。perspective(n)定义3D转换元素的透视视图。上一篇:
下一篇:
最新发布
直达课程主页
珠峰故事
走进河北交通职业技术学院，为电气与信息工程系大一新生开展“Web前端实训”
为什么我想学习，却坐立不安，心神不定，思前恐后，很难有进步
幸福是什么？论珠峰培训的“道”和“义”
珠峰培训走进河大，开展“新媒体运营”实训课程，为第五届传媒文化节增添特色
石家庄邮电职业技术学院：走进计算机系，联合开展前端开发新兵训练营