其他分享
首页 > 其他分享> > html + css 琐碎

html + css 琐碎

作者:互联网

BFC 的概念

  BFC 是一个容器,是一个独立的布局环境,决定了元素如何对其内容就行定位,以及与其他元素的关系和相互作用;BFC 中的子元素的布局不会受到外界的影响;

  BFC 的布局规则:

    1)、在 BFC 下,内部的 box 会在垂直方向,一个接一个的放置;

    2)、Box 垂直方向的距离由 margin 决定;属于同一个 BFC 的两个相邻 Box 的 margin 会发生叠加;

    3)、在 BFC 中,每一个盒子的左边缘 margin-left 会触碰到容器的左边缘 border-left ,即使存在浮动也会如此;

    4)、BFC 的区域不会与 float box 重叠;

    5)、计算 BFC  的高度,浮动元素也会参与计算;

  触发 BFC 的条件:

    1)、根元素即html;

    2)、float 的值不为 none;

    3)、overflow的值不为 visible;

    4)、display的值为 inline-block、table-cell、table-caption;

    5)、position 的值为 absolute 或 fixed;

标签:BFC,Box,琐碎,元素,html,table,margin,css
来源: https://www.cnblogs.com/mufc/p/11417902.html