css中的定位疊放次序z index

我們知道，絕對定位是不占用位置的，那我假如有三個絕對定位的一模一樣的盒子，那哪個浮在最上面呢？看看下面**：

<

!doctype html>
"en"
>
"utf-8"
>
"viewport" content=
"width=device-width, initial-scale=1.0"
>
document
.box 
.big 
.middle 
.small 
"box big"
>
"box middle"
>
"box small"
>

我們看看瀏覽器顯示結果：

所以我們能夠總結：定位疊放順序的其中乙個特點：如果屬性值相同，則按書寫順序，後面的盒子居上。

如果我要讓第乙個盒子居上，那應該怎麼做呢？

這時候我們就要手動給第乙個盒子加上

看下面**：

執行結果如下：

如果看得還是不是很清楚，那我們給三個盒子不一樣位置，就能清楚看到疊放順序啦，**如下：

<

!doctype html>
"en"
>
"utf-8"
>
"viewport" content=
"width=device-width, initial-scale=1.0"
>
document
.box 
.big 
.middle 
.small 
"box big"
>
"box middle"
>
"box small"
>

所以我們能夠總結：加了z-index，1是大於預設auto的，此時盒子就能居上

第三個問題，如果此時我們想讓中間盒子在最上層，第乙個盒子在中間層，那應該怎麼做呢？

<

!doctype html>
"en"
>
"utf-8"
>
"viewport" content=
"width=device-width, initial-scale=1.0"
>
document
.box 
.big 
.middle 
.small 
"box big"
>
"box middle"
>
"box small"
>

看上面的**：我只不過在第二個盒子那裡加了z-index:2;

執行結果如下：

因此我們能夠總結：z-index的數值越大，盒子就能越靠上~

還有兩個特點要記住：

z-index：數值；數值後面不要加單位

還有，還有定位的盒子才有z-index屬性喲~

Flex中改變panel的疊放層次

12 00 15 flex中預設先定義的物件在下層，後定義的物件是在上層。這裡不過是通過靜態還是動態方式建立的控制項，均是按照後者在前的原則來設定顯示的層次的。flex的調整函式為setchildindex displayobject,ind 可以用來調整容器中所有控制項或者是子容器的層次順序，具體...

Flex中改變物件在容器中的疊放層次

1 在容器中新增物件 移除物件和檢測容器中是否存在物件 容器物件.addchild 顯示物件 在容器中新增物件 容器物件.removechild 顯示物件 在容器中刪除物件 容器物件.contains 顯示物件 檢測容器中是否存在顯示物件，如果存在返回true,不存在返回false.2 在容器中新增...

Flex中改變物件在容器中的疊放層次

1 在容器中新增物件 移除物件和檢測容器中是否存在物件 容器物件.addchild 顯示物件 在容器中新增物件 容器物件.removechild 顯示物件 在容器中刪除物件 容器物件.contains 顯示物件 檢測容器中是否存在顯示物件，如果存在返回true,不存在返回false.2 在容器中新增...