美文网首页
CSS样式之块级格式化上下文(BFC)------ 2020-0

CSS样式之块级格式化上下文(BFC)------ 2020-0

作者: 自己写了自己看 | 来源:发表于2020-01-19 15:05 被阅读0次

1、块级格式化上下文

/**
块级格式化上下文,全称是Block Formatting Context,简称BFC;
它是一块独立的渲染区域,它规定了在该区域中常规流块盒的布局,不同的BFC区域,它们进行渲染时互不干扰;
创建BFC的元素,隔绝了它内部和外部的联系,内部的渲染不会影响到外部;
*/

2、具体规则:

/**
1、创建BFC的元素,它的自动高度需要计算浮动元素;
2、创建BFC的元素,它的边框盒不会与浮动元素重叠;
3、创建BFC的元素,不会和他的子元素进行外边距合并;
*/

3、创建BFC的条件:

/**
1、添加浮动的元素;
2、绝对定位的元素:position:absolute;
3、overflow:hidden的元素;
*/

相关文章

  • CSS清除浮动的方法

    BFC CSS中的BFC BFC:block formatting context块级格式化上下文; BFC 与清...

  • BFC

    什么是BFC CSS规范:格式化上下文(blockformattingcontext) MDN:一个块格式化上下文...

  • css

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

  • BFC

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

  • BFC原理解析

    BFC BFC(Block Formatting Contexts),块级格式化上下文 盒模型 CSS盒模型描述了...

  • BFC IFC GFC FFC的理解

    FC:formatting context 格式化上下文。css2.1定义了 BFC 块级格式化上下文 + IFC...

  • [前端基础]前端开发基础整理(基础篇)

    1.0 BFC BFC(Block Format Context)块级格式化上下文,在CSS中不同的display...

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

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

  • 9.BFC

    一、什么是BFC BFC全称是Block Formatting Context,即块格式化上下文。它是CSS2.1...

  • 学习BFC

    什么是BFC BFC全称是Block Formatting Context,即块格式化上下文。它是CSS2.1规范...

网友评论

      本文标题:CSS样式之块级格式化上下文(BFC)------ 2020-0

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