学习flow-root前，我们要先了解下BFC的概念。
在W3C规范中BFC是这样定义的：
浮动元素和绝对定位元素，非块级盒子的块级容器，以及overflow值不为visiable的块级盒子，都会为他们的内容创建新的BFC。
在BFC中，盒子从顶端开始垂直的一个接一个地排列，两个盒子之间的垂直间隙是由他们的margin值决定的。
在一个BFC中，两个相邻的块级盒子的垂直外边距会产生折叠。每一个盒子的左外边缘（margin-left）会触碰到容器的左边缘（border-left）。对于从右到左的格式来说，则触碰到右边缘。
BFC的通俗理解为：
BFC是一个名词，是一个独立的布局环境，我们可以理解为一个箱子，箱子里面物品的摆放是不受外界的影响的。转换为BFC的理解是：BFC中的元素布局是不受外界的影响（我们往往利用这个特性来清除浮动元素对其非浮动的兄弟元素和其子元素带来的影响），并且在一个BFC中，一块和一行中所有的内联元素所组成的都会垂直的沿着其父元素的边框排列。
CSS属性flow-root是CSS Display Module Level3中的一个属性，了解flow-roo...
学习flow-root前，我们要先了解下BFC的概念。 在W3C规范中BFC是这样定义的： 浮动元素和绝对定位元素...
介绍 display 是CSS属性指定用于元素的呈现框的类型。 在 HTML 中，默认的 display 属性取决...
针对与display 新增的属性，flow-root； 该属性的作用是可以让一个元素，具备块儿级的属性，并让内部元...
CSS position属性 CSS display属性 CSS float属性 （引用：https://www...
创建bfc: display: flow-root; fr单位
display属性在前端中大致分为html dom display属性和css display属性。本文主要讲解...
1. Flex布局介绍 CSS的传统布局解决方案，基于盒状模型，依赖display属性、position属性、fl...
CSS入门（3） CSS的常见布局 CSS常见布局使用display属性（文档流）+position属性（定位）+...
一 标准流 二 display属性 display属性(CSS属性): # 尽量别用下面就是示列，有系统BUG,...
本文标题：Css属性 display:flow-root 的介绍
本文链接：https://www.haomeiwen.com/subject/jjifbxtx.html
网友评论