CSS浮動布局是CSS布局中最常用的一種布局方式。它能夠讓你的網(wǎng)頁元素像海浪一樣“浮動”在頁面上，從而實(shí)現(xiàn)豐富多彩的網(wǎng)頁布局效果。

下面是一個(gè)CSS浮動布局的實(shí)例，讓我們一起來看看吧：

.container {
width: 600px;
margin: 0 auto;
overflow: hidden;
}
.box {
width: 200px;
height: 200px;
float: left;
margin: 10px;
}

這是一個(gè)非常簡單的浮動布局，我們首先定義了一個(gè)名為.container的div，寬度為600像素，并設(shè)置了居中的margin樣式和overflow:hidden來清除浮動。接下來，我們定義了一個(gè)名為.box的div，寬度和高度均為200像素，并設(shè)置了浮動和margin樣式。

通過這兩個(gè)CSS樣式，我們就可以實(shí)現(xiàn)這樣一個(gè)頁面布局：三個(gè)大小相同，相互之間距離為10像素的元素“浮動”在.container的div內(nèi)，形成了一個(gè)美麗的布局效果。