后端学前端必知001-CSS布局-float-浮动

最初浮动

主要是用来在网页左文字环绕效果的.
后被广泛拿来进行float布局

脱离文档流

浮动会脱离文档流
父元素会被影响.
子元素撑不起父元素高度

解决

有很多办法.主要是添加css样式

.clearfix::after{
	content:'';
	display:block;
	clear:both;
}

双伪元素

.clearfix::after,.clearfix::before{
	content:'';
	display:table; / 这里可能不是table.具体可以参考其他的
	clear:both;
}

兼容IE

.clearfix {
	*zoom: 1;
}

效果

这么一来,子元素会按浮动来排列
父元素会有高度.
在父元素下面新增div,也会老老实实的进行排列