CSSfloat属性

四个参数

• float：left 左浮动
• float：right 右浮动
• float：none 不浮动
• float：inherit 继承浮动

实现文本的水平排列及环绕

左浮动：排列顺序顺序排列

右浮动：排列顺序逆序排列

代码应用：

应用结果：

一旦元素添加了float 属性，元素则变为块级元素

浮动脱离了正常的文档流，但仍然占据原有的文档流的储存空间

CSS中的定位机制

• 标准流（普通流）
• 定位
• 浮动

父元素的塌陷

浮动副作用的解决：

• 手动给父元素添加高度
• 通过clear清除内部和外部浮动
• 给父元素添加overfloat属性并结合zoom：1使用
• 给父元素添加浮动

clear属性：

• clear：none
• clear：left 不允许左边有浮动对象
• clear：right 不允许右边有浮动对象
• clear：both 不允许有浮动对象

例：

添加clear后

overflow：用来处理溢出问题

zoom：IE专用属性，通过子元素的总体高度，来放大缩小父元素的高度

当两个属性同时使用，则可以解决塌陷问题

float应用

实现一个简单的网页表头

实现结果：