水平分類是一種在網頁設計中非常常用的布局方式，它可以讓我們更好地將內容區分開來，并且使頁面顯得更加清晰明了。在 CSS 中，我們可以使用 flexbox 或者 float 屬性來實現水平分類布局。

下面是使用 flexbox 實現水平分類的 CSS 代碼：

.container {
display: flex;
justify-content: space-between;
}
.item {
flex-grow: 1;
max-width: 30%;
}

上面的代碼中，我們首先創建了一個容器，將其設為 flex 布局。然后，我們將每個項目的 flex-grow 屬性都設為 1，這樣每個項目就會平均地占據剩余空間。我們同時使用 max-width 屬性來保證每個項目的最大寬度不超過 30%。

如果你想使用 float 屬性來實現水平分類，下面的代碼會有所幫助：

.container {
overflow: auto;
}
.item {
float: left;
width: 30%;
margin-right: 5%;
}
.item:last-child {
margin-right: 0;
}

在這個例子中，我們將容器的 overflow 屬性設為 auto，這樣當項目寬度超出容器時，容器就會自動出現滾動條。我們將每個項目設為 float: left，這樣它們就會排成一行。我們同時使用 margin-right 屬性來給項目之間留出一些空隙，最后一個項目的 margin-right 屬性設為 0，防止它占據過多的空間。