css中的z index屬性

2021-09-30 13:48:03 字數 293 閱讀 3848

參考:

先說下總結:

1、z-index:必須結合relative或absolute才有效

2、兄弟元素之間:z-index:0、z-index:auto、z-index不寫效果是一樣的,他們之間按照書寫的順序去覆蓋

3、如果想讓父元素覆蓋掉子元素,就要使子元素的z-index為負值同時父元素還不能設定z-index的值或設定為auto(注意設定為0或者負值都不可以)

4、如果父元素設定了z-index值,那麼子元素再設定z-index也只能影響子元素兄弟之間的層疊順序而不能影響叔叔之間的層疊順序

關於css中的z index 屬性

檢索或設定物件的層疊順序。較大 number 值的物件會覆蓋在較小 number 值的物件之上。如兩個絕對定位物件的此屬性具有同樣的 number 值,那麼將依據它們在html文件中宣告的順序層疊。對於未指定此屬性的絕對定位物件,此屬性的 number 值為正數的物件會在其之上,而 number 值...

CSS中z index屬性具體

層相對於螢幕縱深方向的順序。你用幾個層疊在一起就可看出它的含義。如以下是相關測試 z index 2 background color red z index 1 top 20px background color blue 說明 第乙個div模組中,我們定義了寬度為150,高度為100,背景色為紅...

CSS中z index的屬性與使用

z index 屬性指定乙個元素的堆疊順序。擁有更高堆疊順序的元素總是會處於堆疊順序較低的元素的前面。z index 僅能在定位元素上奏效,z index 進行定位元素 position absolute,position relative,or position fixed 瀏覽器支援 所有主流瀏...