側邊欄布局是網頁設計中常用的布局之一。通過使用CSS的樣式規則，可以輕松地為網頁創建具有吸引力的側邊欄布局。下面就介紹一些常用的CSS樣式和代碼：

.sidebar {
width: 250px;
float: left;
margin-right: 20px;
}
.content {
width: 700px;
float: left;
}
.clearfix {
clear: both;
}

以上是CSS代碼的主要部分，其中，.sidebar和.content是兩個主要的CSS類。在這里，我們使用了浮動來讓側邊欄和主內容區彼此并列。 .sidebar類定義了側邊欄的寬度，并將其浮動到左側。.content類定義了主內容區的寬度，并將其浮動到左側。這使得側邊欄和主內容區能夠出現在同一行上。同時，通過使用margin-right屬性，可以在側邊欄右側留下一些空隙，使得網頁看起來更加美觀。

在最后，我們使用了.clearfix類來清除浮動。因為側邊欄和主內容區都是浮動的，所以我們需要使用.clearfix類來清除它們的浮動狀態并確保它們之后的內容正常顯示。

總之，側邊欄布局CSS樣式和代碼可以幫助網頁設計者輕松實現各種不同類型的網頁布局，同時也為網頁設計提供了更多更靈活的選擇。使用這些樣式和代碼，設計者可以讓自己的網頁看起來更加專業和吸引人。