admin 管理员组

文章数量: 1184232

如上图，在积分的数字元素上，使用了transform perspective，其层级就穿透了上面的遮罩层，关键代码如下：

.mask {
　　position: fixed; 
　　z-index: 99;
}
.flip {
　　transform: perspective(400px) rotateX(40deg);
}

具体解决方法：

1. 在有perspective的元素的任意父级添加overflow:hidden;

2. 在layer元素上添加transform:translateZ(500px)，500px是一个足够大的值即可，具体可尝试一下

 

具体内容可以参考张鑫旭的博客：http://www.zhangxinxu/wordpress/2016/08/safari-3d-transform-z-index/

转载于:https://wwwblogs/mengff/p/8144660.html

本文标签： 层级 transform perspective

版权声明：本文标题：transform perspective的层级问题 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://roclinux.cn/b/1758691237a3089256.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。