CSS中,我們可以使用float屬性來讓多個(gè)div浮動(dòng),以下是一個(gè)示例代碼:
<div style="float: left; width: 100px; height: 100px; background-color: red;"></div> <div style="float: left; width: 100px; height: 100px; background-color: blue;"></div> <div style="float: left; width: 100px; height: 100px; background-color: green;"></div>
在這個(gè)示例中,我們創(chuàng)建了三個(gè)div元素,并設(shè)置了它們的寬度、高度和背景顏色,我們使用float屬性將這三個(gè)div元素浮動(dòng)到左側(cè),你可以看到,這三個(gè)div元素會(huì)按照從左到右的順序排列,并且它們的頂部對(duì)齊。
如果你想讓多個(gè)div元素在不同的行上浮動(dòng),你可以使用clear屬性來清除浮動(dòng)。
<div style="float: left; width: 100px; height: 100px; background-color: red;"></div> <div style="float: left; width: 100px; height: 100px; background-color: blue; clear: left;"></div> <div style="float: left; width: 100px; height: 100px; background-color: green; clear: left;"></div>
在這個(gè)示例中,第二個(gè)和第三個(gè)div元素都使用了clear屬性來清除浮動(dòng),這樣它們就會(huì)在不同的行上浮動(dòng)。