css – Z-Index相对或绝对？

我试图找到一个答案以下问题：

是元素的z-index样式是它的绝对栈顺序还是它的父顺序相对于它的父顺序？

例如，假设我有以下代码：

<div style="z-index:-100">
    <div id="dHello" style="z-index:200">Hello World</div>
</div>

<div id="dDomination" style="z-index:100">I Dominate!</div>

哪一个会在前面 – #dHello，或#dDomination？

这只是举例。我在多个地方尝试过这个，结果似乎有所不同。我看到，如果有人知道一个权威来源解决：

1)关于z-index的实际标准是什么？
2)各个浏览器如何在它们的实际实现上有所不同？

谢谢！

解决方法

z-index是相对的。看到这 detailed answer，我写了一个类似的问题。

If none of the other elements have a defined z-index,using
z-index: 1 will be fine.

Model: How is the z-index determined?

06000

First,the direct
child nodes of the body are walked through. Two elements are
encountered: #A and #F. These are assigned a z-index of 1 and 2. This
step is repeated for each (child) element in the document.

Then,the manually set z-index properties are checked. If two
z-index values equal,their position in the document tree are
compared.

Your case:

06001

You’d expect #Y to
overlap #Z,because a z-index of 3 is clearly higher than 2. Well,
you’re wrong: #Y is a child of #X,with a z-index of 1. Two is
higher than one,and thus,#Z will be shown over #X (and #Y).

这里是一个plunker可视化这一点更好：
http://plnkr.co/edit/CCO4W0NS3XTPsVL9Bqgs?p=preview