请稍等 ...

关于“BFC垂直方向边距重叠”问题，没有明白为什么要这样做，在这里怎么样体现了BFC？

老师，课程盒模型（二）大概三分半钟，关于“BFC垂直方向边距重叠”问题，

第二个元素加父元素不加overflow：hidden样式效果是一样的并没有重叠问题（第二个元素只加父元素之后并没有兄弟元素边距重叠问题），

没有明白为什么要这样做，在这里怎么样体现了BFC？

大大米 2018-06-14 19:37:12

源自：3-5 CSS盒模型（二）

770

收起

提交取消

1回答

qq_天空之镜_2 2018-06-16 10:00:08

你可以先了解下什么是BFC，BFC块及格式化上下文，意思就是说防止边距重叠，你可以把代码粘贴一下，看看是什么问题，你在控制台去掉类名为BFC的overflow的属性试试

<!DOCTYPE html>
<html dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <style media="screen">
      .margin {
        background: red;
        overflow: hidden;
      }
      p {
        margin: 5px auto 20px;
        background: blue;
      }
    </style>
    <div class="margin">
      <p>1</p>
      <div class="BFC" style="overflow: hidden">
        <p>2</p>
      </div>

      <p>3</p>
    </div>

  </body>
</html>

1 回复有任何疑惑可以回复我~

收起回答