设置了 float 属性的元素会根据属性值向左或向右浮动，我们称设置了 float 属性的元素为浮动元素。浮动元素会从普通文档流中脱离，但浮动元素影响的不仅是自己，它会影响周围的元素对齐进行环绕。如果被设置了浮动，那浮动元素会生成一个块级框。

浮动元素的包含块就是离浮动元素最近的块级祖先元素。

• 浮动元素在浮动的时候，其 margin 不会超过包含块的 padding 。
• 如果有多个浮动元素，后面的浮动元素的 margin 不会超过前面浮动元素的 margin。
• 如果两个元素一个向左浮动，一个向右浮动，左浮动元素的 marginRight 不会和右浮动元素的 marginLeft 相邻。
• 浮动元素顶端不会超过包含块的内边界底端，如果有多个浮动元素，下一个浮动元素的顶端不会超过上一个浮动元素的底端。
• 如果有非浮动元素和浮动元素同时存在，并且非浮动元素在前，则浮动元素不会不会高于非浮动元素。
• 浮动元素会尽可能地向顶端对齐、向左或向右对齐。

clear 属性：确保当前元素的左右两侧不会有浮动元素。

如果浮动非替换元素，则要指定一个明确的宽度，否则，它们会尽可能地窄。

替换元素是浏览器根据其标签的元素与属性来判断显示具体的内容。img、input、textarea、select、object 等都是替换元素，这些元素都没有实际的内容。替换元素可以增加行框高度，但不增加 line-height。

非替换元素：大多数元素是不可替换元素，他们将内容直接告诉浏览器，将其显示出来。
比如 p的内容、label的内容；浏览器将把这段内容直接显示出来。