CSS寬度填滿是Web開發中經常使用到的一種技巧，它可以讓元素的寬度自動填滿父級容器的寬度，使頁面布局更加靈活，下面我們來學習一下如何實現這個效果。

/* 樣式代碼如下 */
.element {
box-sizing: border-box; /* 邊框和內邊距不會增加元素的寬度 */
width: 100%; /* 寬度占滿父容器 */
padding: 10px; /* 內邊距，不會影響元素的總寬度 */
border: 1px solid #000; /* 邊框，不會增加元素的寬度 */
}

這段代碼中主要使用了CSS的盒子模型和寬度計算規則。首先，我們將box-sizing設置為border-box，這樣元素的邊框和內邊距不會增加元素的寬度。然后，將width設置為100%，使元素的寬度占滿父容器的寬度。最后，加上適當的padding和border，美化元素的外觀。

使用這種寬度填滿的技巧可以大大簡化頁面布局的代碼，也方便了響應式設計。當頁面寬度發生變化時，元素的寬度也會自適應變化，使布局更加自然流暢。

總之，在開發網頁時，了解和熟練使用CSS寬度填滿技巧是非常重要的，它可以使我們的頁面布局更加優雅，代碼更加簡潔。