CSS疊加兩個圖片的方法

在CSS中，我們可以使用相對定位（relative positioning）和***定位（absolute positioning）來疊加兩個圖片，相對定位是指將元素相對于其正常位置進行定位，而***定位則是將元素相對于瀏覽器窗口進行定位，通過結(jié)合使用這兩個屬性，我們可以輕松地疊加兩個圖片。

我們需要創(chuàng)建一個包含兩個圖片的HTML結(jié)構(gòu)，每個圖片可以作為一個div元素，并賦予一個***的ID。

<div id="image1">
  <img src="image1.jpg" alt="Image 1">
</div>
<div id="image2">
  <img src="image2.jpg" alt="Image 2">
</div>

在CSS中，我們可以使用position屬性來設(shè)置每個圖片的相對位置，我們可以將***個圖片設(shè)置為相對定位，并將其位置設(shè)置為top: 0; left: 0;這樣它就會被定位到容器的左上角，我們可以將第二個圖片設(shè)置為***定位，并將其位置設(shè)置為top: 0; left: 0;這樣它就會被定位到***個圖片的上方。

#image1 {
  position: relative;
  top: 0;
  left: 0;
}
#image2 {
  position: absolute;
  top: 0;
  left: 0;
}

通過這種方式，第二個圖片就會被疊加到***個圖片的上方，從而實現(xiàn)兩個圖片的疊加效果。