網頁布局是網頁制作中非常重要的一部分，對于網頁的美觀性和可用性都有很大的影響。而CSS就是網頁布局的基礎，能夠讓網頁設計師更好地掌握并應用各種布局方式。

CSS中的布局主要有三種方式：浮動布局、定位布局和彈性布局。浮動布局是指將元素左右浮動，可以實現兩欄、三欄布局等，并且可以設置元素的寬度和高度。定位布局是指通過設置元素的絕對或相對定位，來達到元素自由移動或懸浮在其他元素上的效果。而彈性布局則是通過設置元素的彈性空間來實現網頁的響應式布局，可以根據不同的設備自動調整布局方式和大小。

/*浮動布局*/
.container{
width: 100%;
}
.left{
width: 30%;
float: left;
}
.right{
width: 70%;
float: right;
}
/*定位布局*/
.box1{
position: absolute;
left: 0;
top: 0;
}
.box2{
position: absolute;
right: 0;
top: 0;
}
/*彈性布局*/
.container{
display: flex;
flex-direction: row;
justify-content: space-between;
}
.box1{
flex: 2;
}
.box2{
flex: 1;
}

以上是三種常見的CSS網頁布局方式，通過以上代碼的設置，我們可以實現不同的網頁布局效果，讓網頁更加美觀、實用和易用。同時也可以靈活調整網頁布局與風格，更加符合用戶的需求。在實際的網頁制作中，我們可以根據具體的需求選擇不同的布局方式，實現更加豐富和多樣的網頁效果。