CSS清除浮动，父元素盒子自适应调整高度

浮动的特性：
https://editor.csdn.net/md?not_checkout=1&articleId=122625520

清除浮动

很多情况下，子盒子可能不断增加，父级盒子不方便给出固定高度，但是子盒子若浮动时就会不占有位置，导致父盒子的高度为0，影响下面的标准流盒子的布局。

清除浮动的本质就是清除浮动元素造成的影响，若父级盒子本身有高度，则不需要清除浮动。

清除浮动后，父级就会根据浮动的子盒子自动检测高度，当子元素增加后父级盒子也会随之拓展，父级有高度后就不会对下面的标准流盒子布局造成影响。

选择器 {
	clear: 属性值;
}

属性值：
left			//不允许左侧有浮动元素，清除左侧浮动元素的影响
right			//不允许右侧有浮动元素，清除右侧浮动元素的影响
both			//同时清除左右侧浮动元素的影响，最为常用

清除浮动----额外标签法（隔墙法）

即在浮动元素末尾再添加一个空的标签，并设置清除浮动的样式属性。如<div style="clear: both"></div>，或者其它标签，如<br />等。

注意：这个新的空标签必须是一个块级元素。

比较方便容易写，但是会添加许多无意义的空标签，结构性较差。

清除浮动—父级添加overflow

可给父级元素添加overflow属性，将属性值设置为hidden,auto或scroll（一般使用hidden）。

写法简洁，但是无法显示出子盒子溢出父级元素的部分。

清除浮动—伪元素法

父级添加:after，实际上是使用css额外添加标签。

.clearfix:after {
	content: "";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {
	*zoom: 1;			//兼容IE6、7
}

将上述代码添加入css模块内，然后在需要清除浮动的父级元素标签中添加clearfix类名（可以使用多类名）。

该方式结构简单，没有增加额外标签。

清除浮动—双伪元素清除浮动

给父元素添加样式表。

.clearfix:before,.clearfix:after {
	content: "";
	display: table;
}
.clearfix:after {
	clear: both;
}
.clearfix {
	*zoom: 1;
}

将上述代码添加入css模块内，然后在需要清除浮动的父级元素标签中添加clearfix类名（可以使用多类名）。

该方式结构简单，没有增加额外标签。