子元素float具帮，使得父元素不能自適應高度
<!-- syle部分 -->
<style>
.item {
float: left;
width: 100px;
height: 200px;
background-color: red;
}
.item1 {
width: 200px;
height: 100px;
background-color: blue;
}
</style>
<!-- html部分 -->
<div class="box">
<div class="item">Hello overflow float</div>
<div class="item1">Hello overflow</div>
</div>
父元素變窄
父元素的高度變窄：不能在包含浮動子元素的高度博肋，而變窄了，變窄的部分也剛好是浮動元素的高度蜂厅。
(1) 如何在讓父元素重新的包含浮動部分的子元素高度呢匪凡？？掘猿？
方法： 給父元素添加 格式化上下文（BFC）病游。
(2) 那怎么添加BFC呢？稠通？
最簡單的方法：通過 overflow:hidden 屬性
.box{
overflow: hidden
}
父元素重新自適應
(3) 定位的影響
前提我們還是通過overflow:hidden 屬性衬衬，來實現(xiàn)同一個BFC，來達到父元素子適應改橘。
浮動元素相對定位的效果
總結(jié)
元素內(nèi)部的元素因為浮動滋尉， 而產(chǎn)生了父元素變窄的情況，父元素不能自適應飞主。
父元素通過創(chuàng)建BFC來重包含浮動元素狮惜，來達到自適應的效果高诺，同時也清除了浮動！
