BFC:用来解决使两相邻元素间距发生折叠的问题
在css中按照边距重叠的原则.两元素在一起边距会产生重叠。
他们之间的边距取大的那个元素的边距.
比如有如下代码:
<body>
<section id="sec">
<p>1</p>
<p>2</p>
<p>3</p>
</section>
</body>
<style>
#sec{
background:firebrick;
height: 200px;
/* overflow: hidden; */
}
#sec>p{
margin: 5px auto 25px;
background:green;
}
</style>
照理说两个p之间的距离应该是25+5=30;
可现实是他会发生折叠间距变成了25
那BFC就是解决这种问题的方法
BFC:解决了使两相邻元素间距发生折叠的问题
只要在p的父元素上写 overflow: hidden;即可解决