CSS中兩個(gè)圖片如何在一起

在CSS中，我們可以使用多種方法將兩個(gè)圖片放置在一起，以下是一些常見(jiàn)的技巧：

1、使用***定位：我們可以將一個(gè)圖片設(shè)置為***定位，并將其放置在另一個(gè)圖片的上方或下方，我們可以將一個(gè)圖片設(shè)置為position: absolute;，并將其top屬性設(shè)置為另一個(gè)圖片的高度。

.image-container {
  position: relative;
}
.image-1 {
  position: absolute;
  top: 0;
  left: 0;
}
.image-2 {
  position: absolute;
  top: 100px;
  left: 0;
}

2、使用浮動(dòng)：我們可以將一個(gè)圖片設(shè)置為浮動(dòng)，并將其放置在另一個(gè)圖片的左側(cè)或右側(cè)，我們可以將一個(gè)圖片設(shè)置為float: left;，并將其放置在另一個(gè)圖片的左側(cè)。

.image-container {
  position: relative;
}
.image-1 {
  float: left;
}
.image-2 {
  float: right;
}

3、使用Flexbox：我們可以使用Flexbox將一個(gè)圖片放置在另一個(gè)圖片的上方、下方、左側(cè)或右側(cè)，我們可以將一個(gè)圖片放置在另一個(gè)圖片的下方：

.image-container {
  display: flex;
  align-items: flex-end;
}
.image-1 {
  align-self: flex-end;
}

這些技巧可以幫助我們?cè)贑SS中將兩個(gè)圖片放置在一起，您可以根據(jù)自己的需求選擇***適合的方法。