CSS圖像放在列中間的方法

在CSS中，將圖像放在列中間是一個(gè)常見的需求，為了實(shí)現(xiàn)這個(gè)效果，我們可以使用CSS的flexbox布局，下面是一個(gè)簡單的示例代碼：

HTML結(jié)構(gòu)：

<div class="container">
  <div class="image">
    <img src="path/to/image.jpg" alt="Image">
  </div>
  <div class="text">
    <p>Some text...</p>
  </div>
</div>

CSS樣式：

.container {
  display: flex;
  align-items: center;
  justify-content: center;
}
.image {
  max-width: 50%;
}
.text {
  max-width: 50%;
}

在這個(gè)示例中，我們創(chuàng)建了一個(gè)名為container的div，其中包含了兩個(gè)子div：image和text，我們將container設(shè)置為flexbox布局，并使用align-items和justify-content屬性將其內(nèi)容居中，我們?yōu)?code>image和text設(shè)置了***大寬度為50%，以確保它們不會(huì)超出容器的寬度。

這樣，圖像就會(huì)被放置在列中間，并且文本也會(huì)在其下方居中顯示，你可以根據(jù)具體的需求調(diào)整這個(gè)示例代碼。