先来说一下什么是浮动，简单来说就是将上下排列的元素让它们来左右显示。复杂点是指设置了浮动属性的元素会脱离标准普通流的控制，移动到父元素中指定位置的过程。
在css中通过float属性来定义浮动。
| 属性值 | 描述 |
|---|---|
| Left | 元素向左浮动。 |
| Right | 元素向右浮动。 |
| None | 默认值，元素不动，显示在文本出现的位置。 |
我们用一个简单的示例来了解float的用法：
我们先设置一个父元素，包裹着两个子元素，给他们设置好宽高，为了看得更清楚我给他们分别设置了背景颜色。
默认情况下两个子元素是上下排列的，即float的属性值为none时。
如果我们想让他们左右排列就需要用到float属性了
注：我们想让他们左右显示，就需要给两个子元素都设置float属性，仅给一个子元素设置无效。
先设置float：left属性，两个子元素会从左边开始排列显示。
当设置元素右浮动时，元素是从第一个子元素开始靠右进行浮动。
当然还可以让子元素一左一右显示，即给两个子元素根据需要设置不同的属性值即可。
还应当注意的是，当元素添加浮动之后，就会飘起来了，原本在标准文档流里额位置就不再占有了，后面的内容会自动把位置补上去，且浮动后排版的顺序与在html中标签的书写顺序有关。想让所有的子元素都浮动，就需要给所有的子元素都添加浮动属性。
有需要的可以搜索逆战班！！！