IFC和bfc的知识点。

Posted 2020-07-04

    IFC和bfc的知识点。

    IFC(IFC(inline formatting context),即?内格式化上下?，,?平?向上的margin，border和padding在框之间得到

    保留。框在垂直?向上可以以不同的?式对?：它们的顶部或底部对?，或根据其中?字的基线对?。包含那些框的

    ??形区域，会形成??，叫做?框(line box)。?个?框的宽度由包含它的元素的宽度和包含它的元素??有没有float

    元素来决定，?度的确定由??度计算规则决定。?框的?度?以包含他的内部容器，也可能?它包含的容器们都?（?如

    在基线对?的时候），当他包含的内部容器的?度?于?框的?度时，内部容器的垂直位置由??的vertical（默认值

    )是baseline）这个属性来确定。（这个性质可以?来实现垂直居中）

        bfc独立的渲染区域/与该区域外部不想干/需要触发flower-hidden声明独立

        bfc(内部的Box会在垂直?向，?个接?个地放置。

    Box垂直?向的距离由margin决定。属于同?个BFC的两个相邻Box的margin会发?重叠

    每个元素的margin box的左边， 与包含块border box的左边相接触(对于从左往右的格式化，否则相反)。

    即使存在浮动也是如此。

    BFC的区域不会与float box重叠。

    BFC就是??上的?个隔离的独?容器，容器??的?元素不会影响到外?的元素。反之也如此。

    计算BFC的?度时，浮动元素也参与计算

    根元素

    float属性不为none

    position为absolute或fixed

    display为inline-block, table-cell, table-caption, flex, inline-flex

    overflow不为visibleBFC就是??上的?个隔离的独?容器，容器??的?元素不会影响到外?的元素。反之也

    BFC就是??上的?个隔离的独?容器，容器??的?元素不会影响到外?的元素。反之也

    如此。