头疼，这方块怎么变成方块的
qq_临摹不凡_0
2017-12-01 19:00
这句话什么意思？即绕x又绕y？？
-webkit-transform: rotateX(-20deg) rotateY(-20deg);
还有这句话？？绕Y转90 在沿Z平移吗？？
transform: rotateY(90deg) translateZ(-150px);
这段是什么。。构建正方体吗？？
.item .front {
-webkit-transform: translateZ(150px);
-moz-transform: translateZ(150px);
-ms-transform: translateZ(150px);
-o-transform: translateZ(150px);
transform: translateZ(150px);
}
.item .behind {
-webkit-transform: translateZ(-150px);
-moz-transform: translateZ(-150px);
-ms-transform: translateZ(-150px);
-o-transform: translateZ(-150px);
transform: translateZ(-150px);
}
.item .top {
-webkit-transform: rotateX(90deg) translateZ(-150px);
-moz-transform: rotateX(90deg) translateZ(-150px);
-ms-transform: rotateX(90deg) translateZ(-150px);
-o-transform: rotateX(90deg) translateZ(-150px);
transform: rotateX(90deg) translateZ(-150px);
}
.item .bottom {
-webkit-transform: rotateX(90deg) translateZ(150px);
-moz-transform: rotateX(90deg) translateZ(150px);
-ms-transform: rotateX(90deg) translateZ(150px);
-o-transform: rotateX(90deg) translateZ(150px);
transform: rotateX(90deg) translateZ(150px);
}
.item .left {
-webkit-transform: rotateY(90deg) translateZ(-150px);
-moz-transform: rotateY(90deg) translateZ(-150px);
-ms-transform: rotateY(90deg) translateZ(-150px);
-o-transform: rotateY(90deg) translateZ(-150px);
transform: rotateY(90deg) translateZ(-150px);
}
.item .right {
-webkit-transform: rotateY(90deg) translateZ(150px);
-moz-transform: rotateY(90deg) translateZ(150px);
-ms-transform: rotateY(90deg) translateZ(150px);
-o-transform: rotateY(90deg) translateZ(150px);
transform: rotateY(90deg) translateZ(150px);
}
2回答
-
- 慕前端1455417
- 2018-01-04 00:53:50
不好意思，已经找到了。抱歉啦
-
- 慕前端1455417
- 2018-01-04 00:48:28
请问下最后一个编程练习的源码可以在哪里获得？老师发布出来的资源里面没找到，“同学代码”里面还没有找到可以很好运行的。或者您能分享下最终的代码吗？
CSS3 3D 特效
78574 学习 · 425 问题
相似问题