CSS是前端開發不可或缺的一環，經典布局是CSS的重要應用之一。下面將介紹幾種常見的經典布局。

1. 浮動布局

.container {
width: 960px;
}
.box {
float: left;
width: 300px;
margin-right: 20px;
}

通過設置.box的float: left屬性，在水平方向上讓元素浮動起來，實現多欄布局。同時需要設置container的寬度和box的寬度和外邊距。浮動布局適用于寬度固定的布局。

2. 定位布局

.container {
position: relative;
}
.box {
position: absolute;
left: 0;
top: 0;
width: 300px;
margin-right: 20px;
}

通過設置.box的position: absolute屬性，可以讓元素脫離文檔流，并相對于容器進行定位。同時需要設置container的position: relative屬性，使得.box相對于container進行定位。定位布局適用于需要精確定位的布局。

3. 彈性盒子布局

.container {
display: flex;
justify-content: space-between;
}
.box {
flex: 1;
}

通過設置.container的display: flex屬性，將容器變為彈性盒子。通過設置box的flex: 1屬性，讓元素自適應box的空間。通過設置container的justify-content: space-between屬性，讓box之間均勻分布。彈性盒子布局適用于需要響應式布局的場景。

以上是經典布局的幾種實現方式，可以根據實際需求選擇不同的布局方式。