DIV設置浮動float之後下一個DIV要換行的方法

《div style=「float:left;」》 1111111 《/div》

《div style=「float:left;」》222222 《/div》

《div 》33333333《/div》

 

1111111 和222222  在同一行，接下來的33333333雖然沒有float:left的屬性，可是也會在同一行，

要想讓33333333不在同一行怎麼辦呢，答案很簡單就是加入clear:both;

《div style=「clear:both;」》33333333《/div》

這樣就能夠了解決div換行問題了。在div同一行設置以後進行換行。一樣若是div以後是table的也能夠。以下代碼：

<div style="float:left;"> 1111111 </div>
<div style="float:left;">222222 </div>
<table style="clear:both">
<tr><td>tttttt</td></tr>
</table>

若是div後面是文本框或按鈕之類的，

<div style="float:left;">頁面內容</div><input type=text value=文本框 />

<div style="float:left;">頁面內容</div><button>提交</button>

則沒法在文本框或按鈕上用style="clear:both"，因此能夠使用以下方法：

①在div後面是一<br />進行換行，如：<div style="float:left;">頁面內容</div><br /><input type=text value=文本框 />

②在浮動的div後面增長一個空div並設置clear樣式屬性，如：<div style="float:left;">頁面內容</div><div style="clear:both"></div><button>提交</button>

這樣就能夠解決浮動DIV換行的問題了。

參考出處：

http://blog.sina.com.cn/s/blog_6721f25c0101i1tk.html

http://www.jb51.net/css/221269.html