清除浮动

参考链接： css浮动布局方式

其一，通过在浮动元素的末尾添加一个空元素，设置 clear：both属性，after伪元素其实也是通过 content 在元素的后面生成了内容为一个点的块级元素；
其二，通过设置父元素 overflow 或者display：table 属性来闭合浮动

	<style>
		.clearfix:after {  
		    content: "."; 
		    display: block; 
		    height: 0; 
		    clear: both; 
		    visibility: hidden;  
		}   
	   .clearfix {
	   		display: inline-block;
	   	}  
	   	/* for IE/Mac */   
		.clearfix {
			zoom: 1;   /* triggers hasLayout */  
		    display: block;/* resets display for IE/Win */
		} 	
		/*鉴于 IE/Mac的市场占有率极低,我们直接忽略掉,最后精简的代码如下:*/ 
		.clearfix:after {
			content:".";
		    display:block; 
		    height:0; 
		    visibility:hidden; 
		    clear:both; 
		}
		.clearfix { 
			*zoom:1; 
		}
	</style>