码迷,mamicode.com
首页 > 其他好文 > 详细

float的理解

时间:2015-06-02 23:24:48      阅读:129      评论:0      收藏:0      [点我收藏+]

标签:

1、浮动包裹性——浮动具有让元素按displya:inline-block显示(文字环绕的效果)。
2、浮动破坏性——浮动元素脱离标准流,漂浮在标准流之上,破坏了正常文档流的显示顺序。浮动元素的下一个元素,会和上一个非浮动元素底部垂直对齐。浮动元素的垂直位置会和上一个
标准流元素(block)的底部对齐(元素的顺序是HTML代码中div的顺序决定的)。
3、浮动跟随性——如果A、B两个元素(block)挨着且两个元素都进行浮动了,那么B元素会跟在A元素后面显示成一行,只到宽度不够时才会被挤到下一行。
4、浮动产生父元素高度塌陷——如果一个div中有两个子div,且都是进行浮动的,如果父div没有设置高度,这时父div的高度为0,这时就产生了高度塌陷(父元素的高度为0是因为两个子div
浮动元素脱离标准流,漂浮在标准流之上,所以不能把父元素高度撑开,可以通过清楚浮动解决)。

 

 

 

可参考

http://www.zhangxinxu.com/wordpress/2010/01/css-float%E6%B5%AE%E5%8A%A8%E7%9A%84%E6%B7%B1%E5%85%A5%E7%A0%94%E7%A9%B6%E3%80%81%E8%AF%A6%E8%A7%A3%E5%8F%8A%E6%8B%93%E5%B1%95%E4%B8%80/

http://www.cnblogs.com/iyangyuan/archive/2013/03/27/2983813.html

float的理解

标签:

原文地址:http://www.cnblogs.com/junjieok/p/4547971.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!