清除浮动的4种方式

前言:

首先我们要清楚 为什么要清除浮动？
清除浮动主要为了解决父元素因为子元素浮动引起内部高度为0的问题 //清除浮动的本质

首先浮动就是脱离标准文档流,不占据原来的位置；标准文档里是默认的，从上下到左右
浮动的元素以及特点：

1.脱离标准文档流，不占据原来的位置
2.无论是块元素还是行元素，都可以水平排列，还可以设置宽和高（具有行内块特点）
3.找最近的父元素对齐，不超出内边距的范围

清除浮动的方法(最常用的4种)
1.加高法 2.额外标签法 3.溢出法 4.:after双伪元素清除浮动 单伪元素清除浮动
1.额外标签法： 给谁清除浮动，就在某个元素后面添加一个空白的空标签
优点： 通俗易懂，书写方便但是不推荐使用
缺点： 添加许多无意义的标签，让结构复杂化
用法：我们给small清除浮动（在small后面添加一个空白的标签clear 类名可以随意写），然后设置clear:both;

代码展示:

<div>
	<div class="big">big</div>
	<div class="small">small</div>
	<div class="clear">额外标签</div>
</div>

<style>
.clear{
   
	clear:both;