浮动

,原因分析,1、清除浮动是为了清除使用浮动元素的影响。高度塌陷的父元素。,如果一个块级元素没有设置height，它的height是由子元素打开的。,2、使用浮动后，子元素会脱离标准文档流，也就是说，父...

,1、流又称文档流，是css的基本定位和布局机制。,流是html的抽象概念，隐喻这种排列布局方式自然自动，就像水流一样。流体布局是html默认的布局机制。如果你写的html不使用css，默认情况下(d...

,说明,1、行内元素与浮动元素重叠，其边框、背景和内容将显示在浮动元素之上。,2、块级元素与浮动元素重叠时，边框和背景将显示在浮动元素下，内容将显示在浮动元素上。,实例,以上就是css浮动元素的重叠问...

,说明,1、用于规定元素哪一侧不允许浮动元素，默认值为none，表示不清除，左右两侧允许浮动元素。,2、确保当前元素的左右两侧没有浮动元素。clear只对元素本身的布局起作用。,可选值,left清除左...

,说明,1、当浮动元素浮动时，其margin不会超过包含块的padding。,如果想要超过元素，可以设置margin属性。,如果两个元素一个向左浮动，另一个向右浮动，左浮动元素的marginRight...

,说明,1、BFC是页面上隔离的独立容器，容器中的子元素不会影响外部元素。反之亦然。,这一元素的垂直方向边距将重叠，垂直方向的距离由margin决定，取值。,2、BFC区域不会与浮动盒重叠(去除浮动原...

,说明,1、浮动元素会从普通文档流中分离出来。,但浮动元素不仅会影响自己，还会影响周围元素的对齐。,2、无论是行内元素还是块级元素，如果设置了浮动，浮动元素就会产生块级框。,可以设置width和hei...

,说明,1、传统布局方式就是通过盒模型，使用display属性（文档流布局）+position属性（定位布局）+float属性（浮动布局）。,2、可以分为文档流布局、浮动布局和定位布局。,文档流布局...

,说明,1、给父div定义高度。,原理：给父DIV定义固定高度，可以解决父DIV无法获得高度的问题。,2、使用空元素。,例如(.clear{clear:both}),原理：添加一对空的DIV标签，使用...

,本教程操作环境：windows7系统、CSS3、Dell G3电脑。,说明,1、浮动主要分为左浮动和右浮动，分别为float: left; float: right。,2、每次浮动后，元素本身都脱离...