點評：非同輩元素，任意一者或其祖元素擁有動態定位時，同時各自向上尋找動態定位的祖元素至共有的祖元素的下一級為止，並分別從中拿出具備最高端別的祖元素（或其本身）進行比較。
xml/html code
複製內容到剪貼簿
法則五：非同輩元素，任意一者或其祖元素擁有動態定位時，同時各自向上尋找動態定位的祖元素，並分別從中拿出具備最高端別的祖元素（或其本身）進行比較。
title
>
head
>
<
style
type
="text/css"
>
div
div strong
h3 strong
/*--- 定義方塊外形 ---*/
.div1,
.div2
.granddiv1,
.granddiv2
.parentdiv1,
.parentdiv2
/*--- 定義方塊偏移位置、文字位置 ---*/
.granddiv2
.parentdiv2
.div2
.granddiv2 .parentdiv2,
.granddiv2 .div2,
.parentdiv2 .div2
style
>
<
body
>
<
h3>
法則五<
strong
>
（重要）
strong
>
：非同輩元素，任意一者或其祖元素擁有動態定位時，同時各自向上尋找動態定位的祖元素至共有的祖元素的下一級為止，並分別從中拿出具備最高端別的祖元素（或其本身）進行比較。
h3>
<
p>
情況1：子元素的z-index無論多大，父元素大者居上。
<
p>
<
divclass
="parentdiv1"
style
="position:relative; z-index:2;"
>
.parentdiv1
<
divclass
="div1"
>
.div1
div>
div>
<
divclass
="parentdiv2"
style
="position:relative; z-index:1;"
>
<
divclass
="div2"
style
="position:relative; z-index:10000;"
>
.div2
div>
.parentdiv2
div>
<
p>
情況2：父元素居下，子元素也可以居上。
<
p>
<
divclass
="parentdiv1"
>
.parentdiv1
<
divclass
="div1"
style
="position:relative;"
>
.div1
div>
div>
<
divclass
="parentdiv2"
>
<
divclass
="div2"
>
.div2
div>
.parentdiv2
div>
<
p>
情況1、情況2結合擴充套件比較。
<
p>
<
divclass
="granddiv1"
style
="position:relative; z-index:3;"
>
.granddiv1
<
divclass
="parentdiv1"
>
.parentdiv1
<
divclass
="div1"
style
="position:relative; z-index:10000;"
>
.div1
div>
div>
div>
<
divclass
="granddiv2"
>
<
divclass
="parentdiv2"
style
="position:relative; z-index:4;"
>
<
divclass
="div2"
>
.div2
div>
.parentdiv2
div>
.granddiv2
div>
body
>
html
>
就過如下圖所示：
乙個很重要的提示，ie6下z-index：0是無效的~
IE下的圓角解決方案
當今網頁設計裡涉及到圓角的地方是非常多的，所以這也催生了css3裡面的border radius屬性，但是讓人頭疼的ie8以及以下版本並不支援這一屬性。以下是w3c手冊裡對該屬性相容性的解釋 ie9 firefox 4 chrome safari 5 以及 opera 支援 border radiu...
Linux下SElinux的解決方案
selinux，核心級加強型防火牆。它是強制訪問控制 mac 安全系統，是linux歷史上最傑出的新安全系統。對於linux安全模組來說，selinux的功能是最全面的，測試也是最充分的，這是一種基於核心的安全系統。selinux三個模式 1 enforcing 強制 強制模式 selinux 策略...
Vim下markdown TOC解決方案
在tagbar中新增markdown支援 let g tagbar type markdown sort 0,需要特別注意的是，g tagbar type markdown和 ctagstype markdown 這兩個地方需要和你的vim所識別的markdown格式匹配。檢測自己的vim所識別的m...