haslaylout和bfc解析的理解

字號(hào):


    一、haslaylout和bfc一個(gè)是ie特有屬性,一個(gè)是標(biāo)準(zhǔn)屬性
    二、bfc就是頁(yè)面上的一個(gè)隔離的獨(dú)立容器,容器里面的子元素不會(huì)影響到外面的元素,反之亦然。
    三、bfc有3個(gè)作用
    1.包含浮動(dòng)元素
    2.防止編劇重疊
    3.防止被浮動(dòng)元素覆蓋
    四、觸發(fā)條件:
    float除了none以外的值
    overflow除了visible以外的值(hidden,auto,scroll)
    display(table-cell,table-caption,inline-block,flex,inline-flex)
    position值為(absolute,fixed)
    fieldset元素
    一定要謹(jǐn)記一點(diǎn),bfc是獨(dú)立的一個(gè)容器,不影響其他布局,也不會(huì)受影響,利用其特性,可以解決清除浮動(dòng),2欄布局等問題
    例:2欄自適應(yīng)布局
    1.利用浮動(dòng)和負(fù)margin來解決
    2.觸發(fā)bfc,不會(huì)被浮動(dòng)元素覆蓋