浮动与清除浮动

浮动元素会脱离文档流。

• 浏览器按代码顺序渲染，当浮动元素在浮动时遇到其它浮动元素会排在它的后面，如图：

  
  浮动1
  浮动2

• 其它普通块级元素感知不到浮动元素的存在，会占用其位置，这就可能导致覆盖产生。但是块级元素中的文字会环绕浮动元素周围。

  
  图片标题

不想后面的元素被浮动元素遮挡，则可以用清除浮动clear属性

clear属性用于规定元素哪边不允许出现浮动。共有：left，right，none,both,inherit五个值。如对某元素设置了clear：left，则表示不允许该元素右边有浮动元素，只对该元素有效。
没有清除浮动时