基础知识3 浮动

---

浮动
  float:left/right/none

---

清除浮动
  overflow:hidden  隐藏浮动效果
  clear:both       清除浮动
  :after{content:"";display:block;clear:both;}

---

浮动的特点

1.设置浮动的元素会脱离文本流
2.不占据页面之间
3.它位于自己的父级div内
4.可以向左或向右浮动，直到它的外边缘碰到包含框或者另一个浮动元素为止，但是不能进行上下浮动。
5.使用它来实现特殊的定位效果。
6.块级元素可以设置浮动，行内元素也可以设置浮动，设置后能够设置宽高。
7.块级元素浮动后，不会盖住行内元素。

浮动的情况

1.如果元素浮动的下方文本流有元素，那么会覆盖这个元素。
2.包含框如果不够宽，那么浮动元素会向下移动。
3.元素同时向左或者向右浮动，会在同一行显示。
4.如果前面的浮动元素比后面的浮动元素高，那么后面的浮动元素会卡在后面。