如果两个元素相对于同一个父级元素绝对定位，top,left全部为0，即两个元素重叠，然后底层的元素无论如何翻转都会被顶层的元素遮挡而看不见。但是css3 文档说明transform-style属性使被转换的子元素保留其 3D 转换，设置 transform-style:preserve-3d,则在web上是正常的，一旦翻转就能看见，但在小程序的开发工具，以及大部分客户端上这个属性无效。我希望底层的元素在翻转时可以翻转到顶层的元素之上。

demo: //demo.wxml <view class=“contanier” style=“width:100vw;height:100vh;position:relative;”>     <view class=“chid-1”>chid-1</view>     <view class=“chid-2”>chid-2</view></view>

//demo.wxss

.contanier {

    width: 100vw;

    height: 100vh;

    position: relative;

    transform-style: preserve-3d;

    perspective: 400vh;

}

 

 .child-1{

    width: 100vw;

    height: 100vh;

    position: absolute;

    top:0px;

    left: 0px;

    transform: rotateX(40deg);

    transform-origin: left top;

    background:green;

 }

 .child-2{

    width: 100vw;

    height: 100vh;

    position: absolute;

    top:0px;

    left: 0px;

    background:red;

 }

这里child-1无论如何翻转都只是在child-2的下面翻转，始终被遮挡而看不见。