为什么要清除浮动?
一开始css的浮动，其本质是用来做一些文字混排效果的，但是后来被我们拿来做布局用，就出现了很多问题。
清除浮动的本质： 为解决父级元素因为子级浮动引起高度为0的问题。
我们很多时候不方便给父盒子的高度，因为我们不清除有多少子盒子，有多少内容。经常的做法会让内容撑开父盒子的高度。 但是如果父盒子中有子盒子浮动了之后，就会影响到后面的盒子，因为浮动元素脱离了标准流。会把后面还在标准流的盒子覆盖，解决这个问题的方法就要清除浮动
清除浮动可以通过以下几种方法：
1. 使用清除浮动的CSS属性：在浮动元素的容器中添加CSS属性“clear:both;”，这将清除浮动元素带来的影响。
2. 使用伪元素清除浮动：在浮动元素的容器中添加一个伪元素，并添加清除浮动的CSS属性，例如“content:'';clear:both;display:table;”。
3. 使用clearfix类清除浮动：在浮动元素的容器中添加一个clearfix类，并在CSS中定义该类，例如“.clearfix:after{content:'';display:block;clear:both;}”。
4. 使用flexbox布局：使用flexbox布局可以避免浮动带来的影响，因为它可以使元素相对于容器进行定位，而不需要使用浮动。
5. 使用网格布局：网格布局也可以避免浮动带来的影响，因为它可以使元素相对于容器进行定位，并可以在网格中自由布置元素。
