原创力文档- 1、本文档共22页，可阅读全部内容。
- 2、原创力文档（book118）网站文档一经付费（服务费），不意味着购买了该文档的版权，仅供个人/单位学习、研究之用，不得用于商业用途，未经授权，严禁复制、发行、汇编、翻译或者网络传播等，侵权必究。
- 3、本站所有内容均由合作方或网友上传，本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺！文档内容仅供研究参考，付费前请自行鉴别。如您付费，意味着您自己接受本站规则且自行承担风险，本站不退款、不进行额外附加服务；查看《如何避免下载的几个坑》。如果您已付费下载过本站文档，您可以点击 这里二次下载。
- 4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等，请点击“版权申诉”（推荐），也可以打举报电话：400-050-0827(电话支持时间：9:00-18:30)。
- 5、该文档为VIP文档，如果想要下载，成为VIP会员后，下载免费。
- 6、成为VIP后，下载本文档将扣除1次下载权益。下载后，不支持退款、换文档。如有疑问请联系我们。
- 7、成为VIP后，您将拥有八大权益，权益包括：VIP文档下载权益、阅读免打扰、文档格式转换、高级专利检索、专属身份标志、高级客服、多端互通、版权登记。
- 8、VIP文档为合作方或网友上传，每下载1次， 网站将根据用户上传文档的质量评分、类型等，对文档贡献者给予高额补贴、流量扶持。如果你也想贡献VIP文档。上传文档
块级格式化上下文
全称BlockFormattingContext，简称BFC
它是一块独立的渲染区域，它规定了在该区域中，常规流块盒的布局
块级格式化上下文
全称BlockFormattingContext，简称BFC
它是一块独立的渲染区域，它规定了在该区域中，常规流块盒的布局
块级格式化上下文
全称BlockFormattingContext，简称BFC
它是一块独立的渲染区域，它规定了在该区域中，常规流块盒的布局
常规流块盒在水平方向上，必须撑满包含块
块级格式化上下文
全称BlockFormattingContext，简称BFC
它是一块独立的渲染区域，它规定了在该区域中，常规流块盒的布局
常规流块盒在水平方向上，必须撑满包含块
常规流块盒在包含块的垂直方向上依次摆放
常规流块盒若外边距无缝相邻，则进行外边距合并
常规流块盒的自动高度和摆放位置，无视浮动元素
块级格式化上下文
全称BlockFormattingContext，简称BFC
它是一块独立的渲染区域，它规定了在该区域中，常规流块盒的布局
块级格式化上下文
全称BlockFormattingContext，简称BFC
它是一块独立的渲染区域，它规定了在该区域中，常规流块盒的布局
BFC渲染区域：
这个区域由某个HTML元素创建，以下元素会在其内部创建BFC区域：
根元素
浮动和绝对定位元素
overflow不等于visible的块盒
块级格式化上下文
全称BlockFormattingContext，简称BFC
它是一块独立的渲染区域，它规定了在该区域中，常规流块盒的布局
BFC渲染区域：
这个区域由某个HTML元素创建，以下元素会在其内部创建BFC区域：
根元素
浮动和绝对定位元素
overflow不等于visible的块盒
意味着，html元素创建的BFC区域，覆盖了网页中所有的元素
块级格式化上下文
全称BlockFormattingContext，简称BFC
它是一块独立的渲染区域，它规定了在该区域中，常规流块盒的布局
BFC渲染区域：
这个区域由某个HTML元素创建，以下元素会在其内部创建BFC区域：
根元素
浮动和绝对定位元素
overflow不等于visible的块盒
意味着，html元素创建的BFC区域，覆盖了网页中所有的元素
块级格式化上下文
元素A
{float:left}
元素B
元素D
元素E
元素G
{overflow:hidden}
元素C
{position:absolute}
元素D
元素F
元素H
块级格式化上下文
元素A
{float:left}
元素B
元素E
元素G
{overflow:hidden}
元素C
{position:absolute}
元素D
元素F
元素H
根元素创建的BFC
块级格式化上下文
元素A
{float:left}
元素B
元素E
元素G
{overflow:hidden}
元素C
{position:absolute}
元素D
元素F
元素H
根元素创建的BFC
元素A创建的BFC
元素C创建的BFC
块级格式化上下文
元素A
{float:left}
元素B
元素E
元素G
{overflow:hidden}
元素C
{position:absolute}
元素D
元素F
元素H
根元素创建的BFC
元素A创建的BFC
元素C创建的BFC
元素G创建的BFC
块级格式化上下文
元素A
{float:left}
元素B
元素E
元素G
{overflow:hidden}
元素C
{position:absolute}
元素D
元素F
元素H
根元素创建的BFC
元素A创建的BFC
元素C创建的BFC
元素G创建的BFC
元素A、元素C、元素E、元素F、元素G
元素B
元素D
元素H
块级格式化上下文
全称BlockFormattingContext，简称BFC
它是一块独立的渲染区域，它规定了在该区域中，常规流块盒的布局
不同的BFC区域，它们进行渲染时互不干扰
创建BFC的元素，隔绝了它内部和外部的联系，内部的渲染不会影响到外部
块级格式化上下文
元素A
{float:left}
元素B
元素E
元素G
{overflow:hidden}
元素C
{position:absolute}
元素D
元素F
元素H
根元素创建的BFC
元素B创建的BFC
元素D创建的BFC
元素G创建的BFC
元素A、元素C、元素E、元素F、元素G
元素B
元素D
元素H
块级格式化上下文
全称BlockFormattingContext，简称BFC
它是一块独立的渲染区域，它规定了在该区域中，常规流块盒的布局
不同的BFC区域，它们进行渲染时互不干扰
创建BFC的元素
文档评论（0）