多個圖像加載在另一個

Question

我面臨一個非常奇怪的問題。我在一個div內使用多個圖像來加載相同的位置。問題是每個圖像在加載時都在彼此之上加載。 CSS的位置設置爲absolute，我只是希望第一張圖像加載第一張圖像下方的其餘圖像而不是它。並休息滑塊將處理。誰能幫我這個 ？

我的結構對於圖像

<div class="container"> 
    <div class="item item-1 active" style="display: block;"> 
     <div class="image"> 
      <img src="./eg/eg-101.jpg" alt="Breakers"> 
     </div> 
    </div> 
    <div class="item item-1 active" style="display: block;"> 
     <div class="image"> 
      <img src="./eg/eg-102.jpg" alt="Breakers"> 
     </div> 
    </div> 
</div> 

Answer 1

默認情況下，如下所示，在DOM低的東西有較高的z-index，並會出現在上面。爲你想要的元素設置一個z-index將會把它放在其餘的元素之上。在所有元素上設置z-index將允許您以任意順序「堆疊」它們。