浮动：float
left：左浮动
right：右浮动
1.元素浮动以后会脱离文档流
2.浮动以后元素会一直往左上角或者右上角飘，直到碰到父元素停止
3.元素浮动以后不会在有块级元素和行内元素区分
解决浮动高度坍塌
<html>
<head>
<title></title>
<style>
*{
margin: 0;
padding: 0;
}
.outer{
margin: 20px;
border: 2px solid blue;
overflow:hidden; /*第二种清除浮动方法，BFC。给父元素加这句*/
}
.inner{
width: 100px;
height: 100px;
background: red;
float: left;
}
/*解决浮动的高度塌陷问题*/
.outer::after{
content: '';
display:block;
clear: left;
}
</style>
</head>
<body>
<div>
</div>
</body>
</html>
