CSS頁面布局是網頁設計中非常重要的一部分。通過使用CSS樣式表可以更好地掌控網頁上各個元素的位置和排列方式，從而讓網頁呈現更美觀、整潔的效果。

CSS三種頁面布局方式包括了流式、浮動和定位。其中流式布局是最常見的一種。它的特點是頁面元素自動適應瀏覽器窗口大小的變化，因此在不同大小的屏幕上都能有較好的顯示效果。

.container {
width: 80%;
margin: 0 auto;
}
.box {
width: 25%;
float: left;
margin: 10px;
}

浮動布局則是將多個元素放置在一個容器中，通過設定元素的float屬性來讓它們自動拼接，并緊貼在一起。但是如果盒子的高度不一致，排版就會亂掉，需要使用清除浮動的方法進行處理。

.container {
width: 80%;
margin: 0 auto;
}
.box {
width: 25%;
float: left;
margin: 10px;
}
.clearfix::after {
content: "";
display: table;
clear: both;
}

定位布局通常用于制作特殊效果的頁面元素，比如懸浮菜單、彈出框等等。它可以讓元素具有相對于父元素或瀏覽器窗口的固定位置。

.container {
position: relative;
}
.box {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

總之，選擇哪種頁面布局方式應該根據我們設計的具體要求和效果而定。