浮动布局

正常文档流：

从左到右，从上到下

核心概要：

浮动元素只对其后面的元素产生影响--

1、后面元素不浮动的情况，浮动元素脱离文档流，后面元素占据浮动元素原有的位置

2、后面元素浮动的情况，两个元素都是左浮动，两元素都脱离文档流，浮动后，后面浮动元素靠在前面浮动元素右边

浮动元素在父元素的内边距里--

清除浮动：

1、写在被影响的元素上(浮动元素后面的元素)

2、css属性--clear:right、left、both

3、含义--清除右浮动对它的影响，清除左浮动对它的影响，清除两边浮动对它的影响

子元素浮动，父元素无高度的解决方案：

1、父元素末尾加一个空div，clear:both

2、父元素写样式::after{content:'';clear:both;display:block;}

3、触发BFC(父元素overflow:hidden;)