CSS 剩余列均分是指，在某個容器內(nèi)，當(dāng)有多列元素需要排列時，將剩余的空白區(qū)域平均分配給各個列的技術(shù)。在設(shè)計響應(yīng)式布局時，這一技術(shù)非常常見。

實現(xiàn)這一效果的 CSS 屬性是flex-grow。這個屬性用于設(shè)置彈性布局中的彈性增長因子，它指定了彈性元素在可用空間內(nèi)所占的比例。

我們先來看一下一個基礎(chǔ)的例子：

.container {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.item {
width: 31%;
}

這是一個包含 3 個等寬列的布局。我們可以通過計算得知，在這個容器中添加一個剩余列，它的寬度應(yīng)該為 7% 才能保證每一列都是等寬的。

但是，當(dāng)我們的布局變得更加復(fù)雜，有多個不同寬度的列時，這種手動計算的方法就不再適用。此時，我們就可以使用flex-grow屬性來解決問題。

.container {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.item {
flex-grow: 1;
}
.item-1 {
width: 25%;
}
.item-2 {
width: 40%;
}
.item-3 {
width: 30%;
}

這個布局包含 3 個列，它們的寬度分別為 25%、40% 和 30%。使用flex-grow: 1屬性，我們不需要手動計算剩余列的寬度，它們將自動平均分配。

需要注意的是，在設(shè)置flex-grow屬性時，其他的彈性布局屬性也需要進(jìn)行設(shè)置，才能實現(xiàn)預(yù)期的效果。