解決圖片豎著排列的問題，我們可以使用CSS中的flex布局或者grid布局來實現(xiàn)。

我們可以創(chuàng)建一個flex容器，將圖片作為flex項放入其中，通過調(diào)整flex容器的方向為垂直方向，我們可以實現(xiàn)圖片的豎著排列。

.flex-container {
  display: flex;
  flex-direction: column;
}
.flex-item {
  width: 100px; /* 圖片寬度 */
  height: 100px; /* 圖片高度 */
}

在HTML中，我們可以這樣使用：

<div class="flex-container">
  <img class="flex-item" src="image1.png" alt="Image 1">
  <img class="flex-item" src="image2.png" alt="Image 2">
  <img class="flex-item" src="image3.png" alt="Image 3">
</div>

這樣，圖片就會按照我們設(shè)定的樣式豎著排列了。

我們還可以使用CSS中的grid布局來實現(xiàn)圖片的豎著排列，通過創(chuàng)建一個grid容器，并將圖片放入其中，我們可以輕松地實現(xiàn)圖片的排列。

.grid-container {
  display: grid;
  grid-template-columns: 1fr; /* 設(shè)置列數(shù)為1，即垂直排列 */
}
.grid-item {
  width: 100px; /* 圖片寬度 */
  height: 100px; /* 圖片高度 */
}

在HTML中，我們可以這樣使用：

<div class="grid-container">
  <img class="grid-item" src="image1.png" alt="Image 1">
  <img class="grid-item" src="image2.png" alt="Image 2">
  <img class="grid-item" src="image3.png" alt="Image 3">
</div>

這樣，圖片就會按照我們設(shè)定的樣式豎著排列了。