如何在html中控制div重疊

我正在創建一個網頁，並且我有兩個'div，例如A和B. 現在A的位置是'固定的'，它位於頁面頂部，但B的位置是'絕對'，位於頁面中間的某個位置。當它們重疊時，B出現在A之上，但我希望這是另一種方式。我希望A能夠超越任何事物，但我不知道該怎麼做。如何在html中控制div重疊

請注意，更改其定位不是一種選擇。

謝謝您提前。 :)

來源

2013-03-15 Makan Tayebi

看看[這裏]（http://stackoverflow.com/questions/270493/how-would-you-make-two-divs-overlap?rq=1），也許它會幫助 – fcm 2013-03-15 19:15:01

使用z-index值將它們相應地調整爲圖層。它的樣式屬性：風格=「的z-index：200」 ......

來源

2013-03-15 19:15:06

給予更大的z-index財產比B

div.a { 
    z-index:2; 
} 
div.b { 
    z-index:1; 
}

您可以閱讀有關z-indexes在MDN做主持，但簡而言之，「當元素重疊時，z順序決定哪一個覆蓋另一個元素，具有較大z-索引的元素通常覆蓋較低元素。」

來源

2013-03-15 19:15:37 j08691

您可以使用CSS z-index設置modifiy非靜態定位的元素順序：

div#A { z-index: 2; } 
div#B { z-index: 1; }

A將被顯示在B.

來源

2013-03-15 19:15:46 aorcsik

您可以使用CSS媒體查詢，如果更改屬性值事實上是重疊的。

或者使用javascript來測試它是否重疊。這是你有一天寫的一個方法：https://github.com/yckart/jquery.overlaps.js

來源

2013-03-15 19:19:28 yckart

使用CSS給Div A一個高Z指數。

#a{ 
    z-index: 100; 
}

這將意味着一個股利肯定會留在所有/大多數其他的元素，該值越高，就越有可能會高於一切取決於其他因素有多少是在網頁上。如果您需要對多個元素進行更精確的重疊控制，請爲您的元素指定特定的z-index值，值越高，元素頂部越多。您也可以使用負值。

來源

2013-03-15 19:30:36 GeorgeV

注：z索引僅適用於定位元件（位置：絕對，位置：相對，或位置是：固定）。

<html> 
    <div id="divA" style="width:100%; height:50px; z-index:2; position:fixed; background-color: red"> 
    </div> 
    <div id="divB" style="width:100%; height:50px; z-index:1; position:absolute; top:30px; left:20px; background-color:green "> 
    </div> 
</html>

divA現在會在divB之上（由於z-index屬性）。但請務必爲divs定義職位屬性。這不會工作，如果我們刪除位置：固定爲divA。

來源

2013-03-15 19:32:15 Srikanth

如何在html中控制div重疊

回答

相關問題