當你想讓你的網頁看起來更好的時候，CSS可以做很多的工作。其中一件最重要的事情就是讓你的網頁更加靈活。這可以通過使用不同的CSS布局來實現。你可以更改元素的寬度和高度、對齊方式和間距，以獲得更具吸引力的頁面。

.container {
width: 80%;
margin: 0 auto;
}
.sidebar {
width: 25%;
float: left;
}
.content {
width: 75%;
float: left;
}

上面的代碼展示了如何使用CSS布局來將網頁分為兩個區域。它有一個父級元素 .container，將其寬度設置為80%，并使其水平居中。然后我們有兩個子元素，左側的.sidebar和右側的.content。我們將 .sidebar 設置為寬度為25％的寬度，并將其設置為向左浮動。 同時，將 .content 設置為寬度為75％的寬度，并將其設置為左浮動。這將使 .sidebar 顯示在左側并讓 .content 占據剩余的右側空間。

CSS布局可以用于創建復雜的多列布局，網格布局和響應式設計。 使用CSS布局，你可以創建出幾乎任何你想要的網頁布局。

在嘗試使用CSS布局時，你需要記住一些最佳實踐:

• 使用百分比寬度，而不是像素寬度，以使你的布局更靈活響應。
• 使用 float，inline-block 和 flex布局使元素更好地響應
• 不要過多地嵌套元素，因為這會使您的CSS更難以管理和維護。

使用CSS的優勢在于您可以創建令人印象深刻和多樣化的布局，而且與使用表格相比，它的性能更好。在編寫布局時，你需要將所有的CSS規則放置在同一個文件中，并盡可能地減少選擇器數目以避免頁面載入速度過慢。

CSS布局是網頁設計的一個核心部分，希望這篇文章可以幫助你學習如何使用它來擴展你的網頁。