CSS float的特性

標籤：href   lock   div   oat   關係   寬度   圖片   display   wordpress   

參考http://www.zhangxinxu.com/wordpress/?p=583 

浮動的出現：

只是用來讓文字環繞圖片而已（給圖片加float）

浮動的兩個特性：

包裹性：

浮動類似於一個帶有方位的display：inline-block 屬性，浮動元素不定義寬度的情況下，寬度是由內容撐開的。

破壞性：

文字之所以會環繞含有float屬性的圖片是因為浮動怕破壞了正常的line boxes。（我在chrome上測試float會把  圖片  的display屬性，從inline改變為block）

直接上個例子：

 

這裡子div相當於一個圖片，給 display賦值inline

 

同時可以發現display自動變成了block ，所以也不會再使用line-boxes本來的計算。（http://www.zhangxinxu.com/wordpress/?p=384這裡講了line-boxes怎麼計算）

相當於這一塊就是我的小王國，算我自已的，其他東西跟我不再有關係。   

CSS float的特性