在網(wǎng)頁布局中經(jīng)常需要將一組元素并排顯示，而HTML中的li標(biāo)簽和CSS中的float屬性恰好能實(shí)現(xiàn)這個(gè)效果。

<ul>
<li>元素1</li>
<li>元素2</li>
<li>元素3</li>
</ul>

如上代碼所示，我們使用ul和li標(biāo)簽來實(shí)現(xiàn)一組元素的列表。但是默認(rèn)情況下每個(gè)元素都是垂直排列的，如果我們想要讓它們并排顯示，我們可以使用CSS中的float屬性。

li {
float: left;
}

如上代碼所示，我們給li標(biāo)簽設(shè)定了float:left屬性，這樣每個(gè)li元素就會“漂浮”并排顯示。但是需要注意的是，使用float屬性時(shí)需要注意清除浮動，否則會出現(xiàn)布局混亂的問題。

<div class="clearfix"></div>
.clearfix:after {
content: "";
display: block;
clear: both;
}

如上代碼所示，我們可以在浮動元素的容器里加一個(gè)空的div，并給它設(shè)定一個(gè)clearfix的class。然后通過:after偽元素和clear:both屬性來清除浮動的影響。