讓float 應用於2 個以上的div

float 屬性用來描述一個div 與鄰近的div 的關係，因此只有"left"、"right" 這兩種屬性值。

].test1 {

]float: left;

]}

].test2 {

]float: right;

]}

]

HTML]<div class="test1"></div><div class="test2"></div> //test1 會浮在test2 的左邊，相當於test2 浮在test1 的右邊。

 

如果希望用float 讓3 個div 依照順序排列，我們可以先把其中兩個「封裝」起來，也就是用另一個div 包住，然後再佣外面的div 跟另一個div 做float 描述。

].test1 {

]float: left;

]}

].test2 {

]float: right;

]}

].test4 {

]float: left;

]}

].test3 {

]float: right;

]}

]

HTML]<div class="test4">

HTML]<div class="test1"></div><div class="test2"></div>

HTML]</div>

HTML]<div class="test3"></div> //test4 在test3 的左邊，於test4 中，test1 在test2 的左邊，因此排成一直線。