CSS浮動布局是一種常用的網頁布局方式，可以輕松制作企業網站。通過浮動元素位置、實現元素的對齊和分列，從而搭建出復雜的網站結構。下面介紹一些CSS浮動布局的基本知識。

/* clearfix */
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
/* 布局容器和內容 */
.container {
width: 1000px;
margin: 0 auto;
}
.box {
float: left;
width: 33.33%;
padding: 20px;
box-sizing: border-box;
text-align: center;
}
/* 響應式布局 */
@media screen and (max-width: 768px) {
.box {
width: 50%;
}
}
@media screen and (max-width: 480px) {
.box {
width: 100%;
}
}

首先我們需要清除浮動，防止布局混亂。在CSS中定義一個clearfix類，使用 :after 偽元素，將 clear 屬性設置為 both。

然后定義一個 .container 容器，并設置寬度和居中。每個要浮動的盒子用 .box 類來定義，并設置寬度為三分之一，也就是三列布局。

在網頁縮放或者屏幕尺寸縮小時，需要使用響應式布局。通過使用@media 媒體查詢來實現。在媒體查詢里修改布局寬度即可。

使用浮動布局可以輕松制作出企業網站的導航、輪播圖、產品介紹等各種頁面結構。在實踐中需要注意布局嵌套和清除浮動，保證頁面的穩定性。