爲什麼z-index不適用於div？

Question

我試圖讓我的頁腳顯示在頁腳背景之上，但z-index似乎沒有工作。有人看到它有什麼問題嗎？ http://jsfiddle.net/f2ySC/

Answer 1

你必須明確定義position屬性：

.footerBox { 
    background-color: #FFFFFF; 
    border: 10px solid #DDDDDD; 
    margin: 10px 0 -200px -10px; 
    width: 1185px; 
    z-index: 1000; 

    position:relative; 

} 

http://jsfiddle.net/f2ySC/1/

---

這帶來的頁腳到current stacking context：

...根元素形式根堆棧上下文。其他堆棧 上下文由具有除「 」auto之外的'z-index'的計算值的任何定位元素（包括相對定位元素的相對 ）生成。堆疊上下文不一定與包含 塊有關。在將來的CSS水平，其他屬性可能會引入 堆疊上下文，例如「不透明」 ......

http://www.w3.org/TR/CSS2/visuren.html#z-index

Answer 2

在footerBox設置position屬性absolute 你的新代碼應如下所示

.footerBox { 
    background-color: #FFFFFF; 
    border: 10px solid #DDDDDD; 
    margin: 10px 0 -200px -10px; 
    width: 1185px; 
    z-index: 1000; 
    position: absolute; 
} 

看到一個演示here

我們ing position: relative也可以工作

Answer 3

這是你要找的效果嗎？ Updated example

我加position: relative;到#footerBack和.footerBox使用負保證金是不是一個好的做法，以使z-index

Answer 4

。的z-index：-1;它只是在另一個div的背景上顯示內容:)