浮动是css里面布局用的最多的属性。通过float属性实现，float有2个值，分别为left、right。表示左浮动和右浮动。
这里我们定义2个div，类名分别为“box1”和“box2”设置float：left。表示左浮动
.box1{
float: left;
width: 200px;
height: 200px;
background-color: yellowgreen;
}
.box2{
float: left;
width: 400px;
height: 400px;
background-color: skyblue;
}
显示在页面的效果如下：
可以看到通过浮动，两个元素并排了，并且两个元素都能够设置宽度、高度了。就不再分行内和块级元素了。我们称之为浮动的元素脱离了标准文档流。
可以举个例子来证明这个观点
同样是2个div
.box1{
float: left;
width: 200px;
height: 200px;
background-color: yellowgreen;
}
.box2{
width: 400px;
height: 400px;
background-color: skyblue;
}
box1有左浮动，box2没有左浮动，此时页面显示为：
