首先明確幾點在文中所需要用到的概念:
注:這些概念為作者自定義,僅用于本文。
引用:
關于同輩元素是個非常關鍵的詞,這里還需要詳細解釋一下。
在這個例子中,div#a與div#b并不是“同輩元素”,只有像div#b和div#c這樣擁有同樣父體div#f的的元素才能叫“同輩元素”。
引用結束
接下來看看這五條法則:
法則一:同輩元素定位方式相同,且無z-index設置時,html靠后者居上。

法則二:同輩元素同為動態定位時,且有z-index設置時,z-index值大者居上。
猛點這里測試
法則三:同輩元素定位方式不同時,動態定位居上。

猛點這里測試
法則四:非同輩元素,任意一者及其祖元素不具備動態布局時,html靠后者居上。

猛點這里測試
法則五:【重要】非同輩元素,任意一者或其祖元素擁有動態定位時,同時各自向上尋找動態定位的祖元素,并分別從中拿出具備最高級別的祖元素(或其本身)進行比較。