如何讓一個div放置在前一個？

Question

通常div會顯示在前一個div之後（比如它的右邊，下邊或任何取決於上下文和設置的樣式的位置）。我需要一個div來顯示（按照Z順序）前一個，如果它不在那裏。我應該爲後臺和前臺div設置什麼樣的風格以使其表現如此呢？

Answer 1

您需要在div元素上使用絕對定位。

給出下面的HTML

<div class="container"> 
    <div class="first-div"></div> 
    <div class="second-div"></div> 
</div> 

你會使用以下CSS

.container { 
    position: relative; 
} 

.first-div, 
.second-div { 
    position: absolute; 
    top: 0; 
    left: 0; 
} 

這裏有一個demo with color。爲了表明它們是分層的，我已經在兩個方向上將第二個div偏移了5個像素。

Answer 2

您可以使用以下HTML結構：

<div class="outer"> 
    <!-- Content of outer div here --> 
    <div class="inner"> 
    <!-- Content of inner div here --> 
    </div> 
</div> 

而應用此CSS：

.outer { 
    position: relative; 
} 

.inner { 
    position: absolute; 
    /** 
    * change this and other CSS properties like left, right 
    * to position the inner div relative to the outer div 
    */ 
    top: 0px; 
} 

Answer 3

只是position:absolute;加入到需要的元素會做的css。