CSS中關於z-index屬性的具體分析

層疊上下文: 三維概念,表示元素在Z軸的位置

  層疊可嵌套,組合成一個分層上下文
  每個層疊上下文和兄弟元素獨立,進行層疊變化或渲染時,只考慮後代元素
  每個層疊上下是自成體系的

層疊順序

1 background~border
2 负z-index
3 block盒子
4 float浮动盒子
5 inline/inline-block盒子
6 z-index:auto/z-index:0
7 正z-index

特性

##  支持負值

  支援 
CSS3 動畫  css2.1中需要和定位元素一起使用
  如定位元素
 z-index 發生巢狀: 後來居上的準則,哪個大哪個上  如發生嵌套: 祖先優先原則,前提 
z-index# 是數值而非 auto , auto 不創建層疊情境

用

  定位元素預設 

z-index: auto; /z-index: 0  
z-index# 不為 # auto 的定位元素,會創建層疊上下文  
z-index 層疊順序的比較止步於父級層疊上下文  避免
 z-index 嵌套層級關係混亂  避免 
z-index 混亂,一閃比一山高的樣式問題  可利用負值,作隱藏
#

以上是CSS中關於z-index屬性的具體分析的詳細內容。更多資訊請關注PHP中文網其他相關文章！