translate与z-index的区别

首页课程实战体系课手记专栏慕课教程

来源：3-4 translate3d

weibo_纷纷的想念_0

2017-02-16 19:02:54

就像float有时候没有作用就用transform：translate和position：absolute，那么要实现一些层叠或者要一个元素浮动到另一个元素之上translateZ（）可以替代z-index吗？两者有什么区别？

写回答

3回答

小于飞飞

2017-02-17

已采纳

》translateZ 在z轴离我们的距离，当translateZ值越小，则子元素大小越小（因为元素远去，我们眼睛看到的就会变小）；translateZ值越大，该元素也会越来越大。

》z-index 属性决定了一个HTML元素的层叠级别。元素层叠级别是相对于元素在Z轴上（与X轴Y轴相对照）的位置而言。一个更高的Z-index值意味着这个元素在叠层顺序中会更靠近顶部。这个层叠顺序沿着垂直的线轴被呈现。注意只是前后层叠关系，与物体的大小没关系。

希望对你有帮助，祝学习愉快，欢迎采纳。

heibo_纷纷的想念_0

h 有一种醍醐灌顶的感觉，谢谢！

h017-02-17

共1条回复

好帮手慕糖

2017-10-15

你好，你好，这里是确实存在的，但是由于我们是从屏幕上往上看的，所以会很难发现哟。

祝学习愉快~

charr

2017-10-14

老师我还是不太明白，既然你说translateZ值的大小会让我们看到的东西变大变小为啥没有效果呢？

0 学习 · 5760 问题

相似问题

回答 1

回答 3

回答 1

回答 1

回答 2