CSS是網頁設計中的重要組成部分，是控制網頁布局的重要手段之一。它可以實現各種各樣的布局，例如：

#示例1 {
display: block;
width: 80%;
margin: 0 auto;
}
#示例2 {
display: flex;
justify-content: center;
align-items: center;
}
#示例3 {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: 20px;
}
#示例4 {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

以上代碼分別展示了四種常見的布局方式。

示例1是最常見的居中布局，利用了塊級元素的寬度和margin屬性。它的寬度是相對于其父元素的百分比，margin則通過設置左右為auto來實現水平居中。

示例2利用了彈性盒子布局，通過設置display為flex，justify-content為center（水平居中），align-items為center（垂直居中）來實現一個元素在容器中水平垂直居中。

示例3則是CSS3引入的網格布局，使用grid-template-columns屬性指定列數和寬度，grid-gap屬性控制網格之間的距離，就可以實現多種復雜的布局。

示例4是定位布局中的絕對定位，通過position: absolute將元素從文檔流中脫離，再通過top、left和transform屬性來設置元素位置，最終實現元素在頁面中居中的效果。

以上是四種常見的布局方式，當然還有更多的實現方式，比如圣杯布局、雙飛翼布局等等。相信不同的布局方式能夠滿足不同的需求，讓網頁設計更加豐富多彩。