4、浮动float

1.float

原理：元素相对于页面 漂浮 起来了
目的：为了让元素并排显示

2.float 问题

2.1 对后面的元素造成了影响

2.2 子元素float 父元素的高度塌陷了

清除浮动的方法

(1)给下面的兄弟元素 clear:both;
(2)给父级加 overflow:hidden;
(3)用伪元素,给父级内容生成
.parent::before{
 display:table; 
 content:"";
}
.parent::after{
 display:table;
 content:"";
 clear:both;
}