使用CSS實現中間3列等寬布局 在網頁布局中，中間3列等寬布局是常見的一種布局方式。在CSS中可以使用flexbox和grid等方式實現中間3列等寬布局。下面我們介紹一下如何使用CSS實現此種布局。 聲明HTML結構： 需要先聲明一個包含三個列的div，如下：

<div class="container">
<div class="column">第一列</div>
<div class="column">第二列</div>
<div class="column">第三列</div>
</div>

方法一：使用Flexbox 首先聲明container設置為display: flex;設置justify-content: space-between;用來使得每一列等寬并占據整個容器。此時，第一列會被放置在頁面的最左側，第三列會被放置在頁面最右側。為了讓這個布局效果實現中間三列，所以需要將第二列自動居中對齊。

.container {
display: flex;
justify-content: space-between;
}
.column {
flex: 1;
}
/*居中對齊第二列*/
.column:nth-child(2) {
display: flex;
flex-direction: column;
justify-content: center;
}

方法二：使用grid 聲明container設置為display: grid;設定grid-template-columns：repeat(3, 1fr);來讓三列等寬。該方法較為簡單，不需要額外的設置。

.container {
display: grid;
grid-template-columns: repeat(3, 1fr);
}

總結： 以上兩種方法都是使用CSS實現中間3列等寬布局的方法。兩種方法都可以實現等寬的三列。flexbox方法需要單獨設置第二列對齊方式，而grid方法則較為常用。需要提醒的是，兩種方法兼容性也不盡相同，需要根據實際情況進行選擇使用。