再观浮动

• 被浮动的元素会以某种方式从文档的正常流中删除，但是浮动元素仍然会对文档中的其他元素产生影响。
• 浮动元素周围的外边距不会合并。
• 如果要为一个非替换元素浮动，那么必须声明非替换元素的width

替换元素就是浏览器根据元素的标签和属性，来决定元素的具体显示内容。例如：img , input , textarea , select , object.大多数元素是非替换元素，他们将内容直接告诉浏览器，将其显示出来。例如： a，p，div

• 浮动元素的包含块是：距离其最近的块级祖先元素。
• 浮动元素会生成一个块级框『相当于被定义"display:block;"』
• 浮动元素的左右外边界不能超出其包含块的左右内边界。
• 浮动元素的左外边界必须是源文档中之前出现的左浮动元素的右边界，除非出现浮动元素的顶端在先出现浮动元素的底端的下面。（避免发生覆盖）
• 左浮动元素的右外边界不会在其右边右浮动元素的左外边界的右边。（防止重叠）
• 一个浮动元素的顶端，不能比其父元素的内顶端更高。
• 浮动元素的顶端不能比之前所有浮动元素或者块级元素的顶端更高。
• 如果源文档中的一个浮动元素之前出现另一个元素，浮动元素的顶端不能比包含该元素所生成框的任何行框的顶端更高
• 左浮动元素的左边有另一个浮动元素，前者的有外边界不能在其包含块的右边界的右边。（浮动元素不能超出其包含元素的边界）
• 浮动元素必须尽可能高的放置。
• 左浮动元素必须向左尽可能的远，位置越高，就会向左浮动的越远。
• 上述这些浮动规则只处理了浮动元素和其父元素的左，右和上边界，而没有涉及到下边界。
• 行内框与一个浮动元素重叠的时候，其边框，背景和内容都在该浮动元素“之上”显示。块框和一个浮动元素发生重叠时，其边框和背景都在该浮动元素“之下”显示，而内容在浮动元素“之上”显示。
• 清除：h3{clear:both;}会确保h3元素不会与任何浮动元素在同一行上面。在css1和css2中，clear清除原理：它会增加元素的上外边距，是指最后落在浮动元素的下面。这实际上会忽略为清除元素“设置了clear”元素的顶端设置和外边距宽度。清除元素的外边距会重新调整。