在html中，你如何將圖像與其他圖像重疊？

-4

如何讓圖像重疊其他圖像，我可以讓文字重疊我的背景圖像，但我想要在圖像頂部的一系列圖像。在html中，你如何將圖像與其他圖像重疊？

2016-06-13 John Mac

在CSS中使用z-index – Li357

糟糕的參數。試着製作一個更有爭議的問題，沒有人會猜測你想要什麼， – christian

只需使用z-index，該數值越高，它堆疊在堆越高（即 - 更接近觀看者）：

img { 
 
    display: block; 
 
    position: absolute; 
 
    top: 0; 
 
    left: 0; 
 
} 
 
.image1 { 
 
    z-index: 9999; 
 
    width: 100px; 
 
    height: 100px; 
 
} 
 
.image2 { 
 
    z-index: 999; 
 
    width: 200px; 
 
    height: 200px; 
 
} 
 
.image3 { 
 
    z-index: 99; 
 
    width: 300px; 
 
    height: 300px; 
 
} 
 
.image4 { 
 
    width: 400px; 
 
    height: 400px; 
 
}

<img class="image1" src="http://gallery.photo.net/photo/6182716-md.jpg"> 
 
<img class="image2" src="http://gallery.photo.net/photo/12682192-md.jpg"> 
 
<img class="image3" src="http://gallery.photo.net/photo/2568318-md.jpg"> 
 
<img class="image4" src="http://gallery.photo.net/photo/6506352-lg.jpg">

來源

2016-06-13 14:08:17

img { 
    position: absolute; 
    left: 0px; 
    top: 0px; 
    z-index: -1; 
}

z-index的值越高越好。

來源

2016-06-13 14:06:54

那麼，如果你只想在背景圖片上面放置一張圖片，那麼就把你的圖片放在你擁有的任何內容中。如果您希望圖像覆蓋圖像，請使用z-index

將z-index應用於每張圖像，其中最高的圖像爲「最高」圖像。

Z-index: 1; 
Z-index: 2; 
Z-index: 3;

等等等等

來源

2016-06-13 14:07:35

在html中，你如何將圖像與其他圖像重疊？

回答

相關問題