是否可以使用CSS在'父母'上浮动'孩子'？就像“其他”一样。现在看起来效果只是缩放“子级”而不是翻译。
body{
height: 100vh;
overflow: hidden;
}
.space{
background: #000;
height: 100vh;
perspective: 1000px;
}
.layer{
position: absolute;
left: 50%;
top: 50%;
transform: translateX(-50%) translateY(-50%) rotateX(85.8deg) rotateY(0.1deg) rotateZ(-45deg);
height: 50%;
width: 50%;
perspective: 1000px;
}
#parent{
background: #fff;
}
#other{
background: #aaa;
transform: translateX(-50%) translateY(-50%) translateZ(1050px) rotateX(72.8deg) rotateY(0.1deg) rotateZ(-45deg);
}<body>
<div class='space'>
<div class='layer' id='parent'>
<div id='child' style="transform: translateZ(200px);background: #555;width: 50%; height: 50%;"></div>
</div>
<div class='layer' id='other'></div>
</div>
</body>transform-style: preserve-3d;工作中