自我总结：
浮动是实现布局的一种常见方式
浮动脱离普通文档流，即页面渲染时，盒模型按标准会将父元素所设置的属性将页面撑开；加入浮动后，父元素不会发现浮动元素，父元素则不会被浮动元素撑开页面）。 块级元素默认样式可以撑满父容器，加入浮动后，块级元素浮动则会收缩到内容本身的宽度。 加入浮动后，在父元素中看不见浮动元素，在行内元素看得见浮动，如文本或其他行内元素都会环绕浮动元素。
加入浮动后，浮动盒会向左或向右移动，直到其外边挨到包含块边沿或者另一个浮动盒的外边。 当同一个方向的浮动元素：当一个浮动元素在浮动过程中碰到同一个方向的浮动元素时，它会紧跟在它们后面； 当反方向的浮动元素：互不影响，位于同一条水平线上，当空间不够时会被挤下。 当浮动盒的宽度不一样时，紧跟后面的另一浮动盒则会出现卡住的现象。
加入浮动后，块级元素内容宽度会缩短，呈现
inline-block``的特性，放不下会换行；行内元素则以块级元素特性呈现，可以设置width、height、margin```。
一、浮动：
1、从实践尝试到理论定义
（1）例子1：
一个浮动盒会向左或向右移动，直到其外边（outerEdge）挨到包含块边沿或者另一个浮动盒的外边。如果没有足够的水平空间来浮动，它会向下移动，直到空间合适或者不会再出现其它浮动了
image
网友评论