标签：

简介

float 属性定义元素在哪个方向浮动。

看了一些资料，其中

http://www.cnblogs.com/polk6/archive/2013/07/25/3142187.html

总结的很详细

自己也做了一些补充和总结

补充和整理

主要分为这几块

• 设置float属性的浮动元素

  

1.对于块级元素，其上一个元素不为【float】属性

对于【div-c】即使在其上一个元素【div-b】的右侧有足够的空间，也不会填充到其右侧，而是另起一行。

对于【div-d】当前一元素【input3】有足够空间时，会填充到其右侧

——> 块级元素，当前一个元素为块级元素【非float】时，会在新行浮动填充；当前一个元素为内联元素【非float】时，同时有足够的空间时会在其后填充【尽可能在更上】

2.对于块级元素，其上一个元素为【float】属性

——>在空间足够的情况下在其后填充【尽可能在更上】

3.对于内联元素

——>内联元素，不论上一个元素为何类，在空间足够的情况下在其后填充【尽可能在更上】

若将【input3】换为<p>【非替换元素】，<p>中内容足够长时可以产生包围效果【尽可能窄】、

• 设置【float】属性之后的非浮动元素

  

1.均是以上一个非【float】为基准，按照自身属性放置

2.对于块级元素

  ——>按照上一个非【float】元素放置的同时，可以被【float】元素覆盖 —>相当于完全直接忽略【float】元素，但会被覆盖在下层，如【div-c】

3.对于内联元素

  ——>如【input1】，按照【div-a】放置，同时不能被【float】元素覆盖 —>有空隙就插入

css-float相关

标签：

原文地址：http://www.cnblogs.com/alia/p/4741542.html