CSS 彈性布局，也稱為 flex 布局，是 CSS3 中新增的一種布局方式，它可以讓網頁元素隨著網頁大小的變化而自適應排列，使得響應式布局更加方便。

與傳統的布局方式相比，使用 CSS 彈性布局可以帶來以下好處：

代碼示例：
.container {
display: flex;
}

1. 自適應大小：使用 flex 布局可以讓元素的大小隨著父元素的大小自適應改變，可以減少對元素進行媒體查詢的次數，更加簡潔明了。

2. 水平垂直居中：使用 CSS 彈性布局可以很方便地實現元素在容器中的水平垂直居中。這通常需要傳統的布局方式中使用大量的 margin、padding 等屬性，但使用 flex 布局則可以簡潔高效地實現。

代碼示例：
.container {
display: flex;
justify-content: center;
align-items: center;
}

3. 等分布局：使用 flex 布局可以使得容器中的元素等分排列，無需使用復雜的 CSS 或 JS。

代碼示例：
.container {
display: flex;
justify-content: space-between;
}

總之，使用 CSS 彈性布局可以大大提高網頁的適應性和美觀度，讓網站更加易于維護和編輯。