美文网首页
BFC(块级格式化上下文)

BFC(块级格式化上下文)

作者: 李小白呀 | 来源:发表于2021-02-21 23:49 被阅读0次

边距塌陷的解决方法-触发BFC
给父元素添加overflow:hidden;

BFC(块级格式化上下文)
a.BFC有隔离作用,内部元素不会受到外部元素的影响。
b.一个元素只能存在于一个BFC中,如果同时存在两个BFC中,违背隔离规则。
c.BFC中元素按照正常流排序,元素之间空隙由margin控制。
d.BFC中的内容不会与外部浮动元素重叠(隔离效果)。
f.在计算其高度的时候,需要包括其中的浮动子元素的高度。

触发BFC的几种方式:
float属性不为none
position为absolute或fixed
overflow不为visible
display属性-inline-block、table-cell(相当于th和td)、table-caption(相当于caption)或伸缩盒子(flex和inline-flex)元素。

相关文章

  • css

    描述BFC(块格式化上下文)及其工作原理。 BFC 即 Block Formatting Contexts (块级...

  • BFC

    什么是 BFC Block Formatting Contexts(BFC):块级元素格式化上下文 BFC布局规则...

  • web前端入门到实战:CSS里的BFC和IFC的用法

    一、BFC Block Formatting Contexts (BFC,块级格式化上下文),就是 一个块级元素 ...

  • CSS知识点----BFC

    BFC(块级格式化上下文) 块格式化上下文(Block Formatting Context,BFC) 是Web页...

  • 学习BFC格式化上下文笔记

    BFC格式化上下文 块级格式化上下文(Block Fromatting Context)是按照块级盒子布局的。 B...

  • BFC / IFC

    BFC(Block Formatting Context)块级格式化上下文 定义:一个块格式化上下文 ( BFC ...

  • 3分钟理解BFC

    BFC的简介 BFC(Block Formatting Context) 块级格式化上下文,是用于布局块级盒子的一...

  • BFC和IFC

    BFC 块级格式化上下文 哪些元素会生产BFC? IFC 行内格式化上下文

  • BFC属性

    BFC(Block formatting context)直译为"块级格式化上下文"。BFC它是指一个独立的块级渲...

  • BFC和IFC

    BFC 块级格式化上下文 IFC 行内格式化上下文

网友评论

      本文标题:BFC(块级格式化上下文)

      本文链接:https://www.haomeiwen.com/subject/lkncfltx.html