首页 > 作文

BFC

更新时间:2023-04-03 14:25:14 阅读: 评论:0

bfc(b骑自行车旅游lock formatting context)块级格式化上下李荣浩公开恋情文,是一个独立的渲染区域。

一、如何触发bfc:

1、根元素(html);

风热感冒和风寒感冒怎么区别2、设置float除none意外的值(left ,right);

3、设置overflow 除visible 以外的值(hidden,auto,sroll);

4、设置displ青年大最新答案第十季第一期答案ay (table-cell,inline-block,flex);

5、设置position(absolute,fixed)

二、bfc的布局规则:

1、内部的box会在垂直方向,一个接一个的放置;

2、box垂直方向的距离由margin决定。同一个bfc的两个相邻 box的margin会重叠;

3、每个元素的margin box (子元素)的左边,与包含块border box(父元素)的左边相接触;

4、bfc是页面上的一个隔离的独立容器,里面的子元素不影响外面;

5、计算bfc的高度时,浮动元素也会参与计算;

6、bfc的区域不与float box(浮动的盒子)重叠。

三、bfc的作用:

1、可以解决上下margin重叠问题,给添加margin值的元素再套一个盒子,并设置overflow:hidden;

2、可以解决高度塌陷问题,子元素浮动脱离了正常的文档流,青海畜牧兽医职业技术学院也脱离了父元素盒子,此时父元素盒子高度为0,给父元素设置overflow:hidden,触发了bfc,闭合浮动;

3、可以实现多栏布局,两个浮动的元素相邻,剩下一个元素设置overflow:hidden ,触发bfc。

本文发布于:2023-04-03 14:25:13,感谢您对本站的认可!

本文链接:https://www.wtabcd.cn/fanwen/zuowen/1ae549ab774a94d50f3d86324e07c8e6.html

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。

本文word下载地址:BFC.doc

本文 PDF 下载地址:BFC.pdf

标签:元素   盒子   高度   布局
相关文章
留言与评论(共有 0 条评论)
   
验证码:
Copyright ©2019-2022 Comsenz Inc.Powered by © 专利检索| 网站地图