CSS3是一種在網頁開發中廣泛使用的樣式表語言。與CSS2相比，它提供了更多的布局功能。本文將介紹如何使用CSS3創建現代布局。

/* 定義網頁容器 */
.container {
width: 100%;
max-width: 1200px;
margin: 0 auto;
}
/* 定義頁面頭部 */
.header {
height: 200px;
background-color: #333;
color: #fff;
text-align: center;
line-height: 200px;
}
/* 定義頁面主體 */
.main {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
/* 定義主體中的項 */
.item {
width: 48%;
margin-bottom: 40px;
}
/* 定義頁面尾部 */
.footer {
height: 100px;
background-color: #555;
color: #fff;
text-align: center;
line-height: 100px;
}

上面的CSS代碼定義了一個網頁容器（.container）和三個部分：頁面頭部（.header）、頁面主體（.main）和頁面尾部（.footer）。

在樣式表中，我們使用了flex布局（display: flex），這是一種強大的布局模型，可以輕松地控制網頁中的元素。例如，我們可以使用flex-wrap屬性來定義當頁面窗口縮小時，項目要換行的條件（flex-wrap: wrap）。

此外，我們使用了一些其他的屬性，如justify-content（定義項目之間的水平對齊方式）和align-items（定義項目在容器內的垂直對齊方式）等等。這些屬性幫助我們更好地布局網頁。

通過上述CSS3代碼，我們可以得到一個美觀、現代的網頁布局，適用于各種設備和屏幕大小。希望這篇文章可以幫助您更好地運用CSS3來創建優秀的網頁布局。