Html 为什么透视图会改变CSS中的固定位置？

在的示例中，元素被设置为固定在同一位置

HTML:

然而，如果我们添加

透视图：1000px

到

div

，位置将看起来像

相对的

，而不是

固定的

。看

为什么设置透视图将其更改为相对透视图 出于某种原因，我必须设置透视图，我希望A、B和C仍然可以处于相同的位置。可能吗

为什么透视图会改变CSS中的固定位置

因为

perspective

建立了一个包含块，类似于

position:relative的方式确实存在，如中所述：

透视图

将此属性与除none以外的任何值一起使用将建立
堆叠上下文。它还建立了一个包含块（在某种程度上
类似于position:relative），就像transform属性一样

由于您将透视图应用于示例中的每个div（以及顶部、左侧属性），因此每个div都会创建自己的包含块，并最终将其推到上一个div的右侧和底部20px。
只是猜测，但是你能不能使用
z-index
？@MrCoder具体怎么用？z-index在这种情况下似乎没什么作用。@RobertHarvey你的答案怎么了？chrome对我来说很好吗？@Coder先生：它不是小提琴中的3D元素。我一点也不相信它有效。我认为小提琴只是忽视了它。听起来很有说服力。但是我能做些什么呢？即使我只将透视设置为父对象，它也会像这样。有没有可能
A
、
B
、
C
处于同一位置，并且它们都是固定的
？我认为这是不可能的（如果不对CSS进行重大更改）。
<div>
    <span>This is A</span>
    <div>
        <span>This is B</span>
        <div>
            <span>This is C</span>
        </div>
    </div>
</div>

div {
    border: 1px solid red;
    position: fixed;
    top: 20px;
    left: 20px;
}