天兴工作室

主题演示站

translate3d和z-index冲突导致z-inde值无效的解决办法

今天碰到了一个css3效果在pc端和安卓端都正常,但是ios端无法正常显示的问题。经过排查后发现是css3的transform动画效果里面的translate3d和z-index冲突导致的。

1.png

z-index是设置元素显示层级的也相当于是个Z轴,translate3d的Z轴也是表示层级的。如果两个参数都设置了不等于0的数值,那么会以Z轴值为准。这就导致了z-index值的失效。

解决办法就是留一个就行了。个人建议如果那个translate3d效果没什么特别的话直接用translate控制X轴和Y轴就行了,Z轴的用处我暂时还没发现...

<< 1 >>
«    2021年1月    »
123
45678910
11121314151617
18192021222324
25262728293031
控制面板
您好,欢迎到访网站!
  查看权限
网站分类
搜索
最新留言
文章归档
网站收藏
友情链接

Powered By Z-BlogPHP 1.7.4

天兴工作室主题演示站点,如遇到问题请联系我们的在线qq:207649916咨询