怎么回答当面试官问你什么是BFC

最新推荐文章于 2024-05-13 23:07:09 发布
最新推荐文章于 2024-05-13 23:07:09 发布
阅读量534 收藏
点赞数
文章标签： 面试
原文链接：https://juejin.im/post/5d00b50af265da1bcd37d069
版权
概述：相信大家平时在工作的时候经常会写BFC，但是当面试官问你什么是BFC的时候，你该怎么回答呢？一个好的回答应该包含哪些？

问题一：BFC的概念？

问题二：BFC的原理？

问题三：如何创建BFC？

问题四：BFC的使用场景？

如果上面四个问题，你都能回答出来，那么说明你已经非常熟悉了BFC的，下面内容可以忽略，若你犹豫不决答不上来，那么请看下面

我通过思维导图把问题跟答案画出来，这样大家能清晰点




转载于:https://juejin.im/post/5d00b50af265da1bcd37d069

weixin_33686714
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
『豪横，让面试官无题可问』☛第二期-Css让人忽视的面试题—–猛男,你还记得吗？
01-08
2.谈一下你对BFC规范的理解3.谈一下CSS3有哪些新增的特性？4.谈一下在页面上隐藏元素的方法有哪些？5.说说什么是重绘和重排？6.谈谈你对相对定位、绝对定位、固定定位的理解7.CSS选择器有哪些？哪些属性可以继承？8....
前端面试：被问到BFC，要这样答才能满分
weixin_60297362的博客
03-04 1861
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档 文章目录一、BFC1. 理解2. 作用3.示例二、使用步骤1.引入库2.读入数据总结 一、BFC 1. 理解 官方解释：BFC(Block formatting context)直译为"块级格式化上下文"，这是一个独自的渲染区域，规定了内部如何布局并且这个区域的子元素不会影响到外面的元素。 说白了：BFC就像一个安全区，这个区域里的所有元素的布局方式（包括浮动、定位等）都不会影响到外面的其他元素的布局。 2. 作用 清除浮动 处理外边距
3、什么是BFC以及他的作用
abuanden的博客
02-25 300
BFC（Block formatting context）什么是BFCBFC的布局规则如何创建BFCBFC的作用1.利用BFC避免margin重叠。2.自适应两栏布局3.清除浮动。总结 转载自：什么是BFC？ 什么是BFC BFC(Block formatting context)直译为"块级格式化上下文"。它是一个独立的渲染区域，只有Block-level box参与， 它规定了内部的Block-level Box如何布局，并且与这个区域外部毫不相干。 在解释什么是BFC之前，我们需要先知道Box
2024年前端最新前端面试：被问到BFC，要这样答才能满分，面试题目与答案
最新发布
2401_84617431的博客
05-13 626
而要解决这一现象，我们就需要清除浮动，这里我们就可以用到了：触发BFC的条件很多，这里我们以向父元素添加overflow(hidden)为例：（下面一节，我会为大家总结触发BFC条件有哪些常用方式）div {我们只需要在原基础上，向父元素添加overflow：hidden属性即可可见，只需要给父容器设置overflow: hidden属性就会触发BFC特性，这个父容器就会变为一个特殊的“其实这里展现了一个。因此这就是为什么BFC能清除浮动带来的负面效果的原因了！
面试必问——什么是BFC问题
阿牛哥的博客
09-12 435
什么是BFC问题
【面试】BFC是什么，有什么用，怎么用？
weixin_62918410的博客
03-23 202
BFC是块级格式化上下文，形成一块独立的渲染区域。可以将BFC看成是元素的一种属性，拥有了这种属性的元素，其内部的子元素将与外部元素隔绝开，互不影响。其实很多时候我们都用到了BFC，只是很多时候可能没有意识到而已。需要注意的是，BFC内部的元素依然与其他内部元素有关联，依然会受到其他元素布局的影响，BFC只是将内部元素与外部元素隔绝开，并不能控制自己内部元素的外边距合并等问题。可以通过BFC内部再次形成BFC解决。
BFC详解(面试题)
知识点沉淀包括不限于前端
04-24 776
css bfc含义 bfc特性 bfc用处 如何生成bfc 面试必问
2020年前端开发应该如何准备面试（面试官角度分享）.pdf
10-21
前端开发面试准备指南 在当前疫情影响下，前端开发工程师面试变得更加重要。...面试官想看到的是你对技术的理解和实际开发能力，准备好自己的简历、技术基础知识和项目经验，你的面试将变得更加自信和成功。
前端春招秋招/前端工程师面试全集
12-06
【前端工程师面试全集】是针对前端开发人员的求职...以上只是部分关键知识点的概述，实际面试中，面试官可能会深入探讨每个话题，并要求解决实际问题。因此，前端开发者需要持续学习和实践，以应对不断变化的技术需求。
挑战一轮大厂后的面试总结 (含六个方向) – css 篇
01-20
面试中，无论你是初级还是高级开发者，面试官都可能会深入探讨这些基础概念，因为它们是CSS布局的核心。扎实的基础知识不仅能帮助你顺利通过面试，而且在实际工作中也能提升开发效率和代码质量。因此，对于CSS的学习...
前端十万字八股文面试笔记
08-21
这篇“前端十万字八股文面试笔记”是一个全面的前端面试指南，涵盖了JavaScript、CSS、计算机网络、操作系统以及Vue等多个核心领域。以下是其中的关键知识点详解： **JavaScript** 1. **DOM事件处理**：`onclick`...
面试官问你MyBatis SQL是如何执行的？
zhutianrong520的博客
02-16 750
MyBatis 整体架构 MyBatis 最上面是接口层，接口层就是开发人员在 Mapper 或者是 Dao 接口中的接口定义，是查询、新增、更新还是删除操作； 中间层是数据处理层，主要是配置 Mapper -> XML 层级之间的参数映射，SQL 解析，SQL 执行，结果映射的过程。上述两种流程都由基础支持层来提供功能支撑，基础支持层包括连接管理，事务管理，配置加载，缓存处理等。 接口层...
linkedhashmap获取第n个元素_JDK1.8源码(九)——java.util.LinkedHashMap 类
weixin_39755625的博客
12-02 762
　　前面我们介绍了 Map 集合的一种典型实现 HashMap ，关于 HashMap 的特性，我们再来复习一遍：　　①、基于JDK1.8的HashMap是由数组+链表+红黑树组成，相对于早期版本的 JDK HashMap 实现，新增了红黑树作为底层数据结构，在数据量较大且哈希碰撞较多时，能够极大的增加检索的效率。　　②、允许 key 和 value 都为 null。key 重复会被覆盖，va...
面试问BFC是什么，如何简单的回答要点？
wang_qiu_shuang的博客
10-16 1954
BFC是什么？ 首先直接翻译一下BFC，BFC全称 Block Formatting Contexts，中文意思为：块级格式化上下文。 通俗一点来讲，可以把BFC理解为一个封闭的大盒子，盒子内部的元素无论怎么样，是跑，是跳、还是飞，都不影响到外部。 然后随便说二三种会触发BFC特性的情况，比如： body根元素 浮动元素：float除none以外的值 绝对定位元素：position（absolute、fixed） display为inline-block、table-cells、flex overflow
面试官：什么是BFC？BFC有什么特性？如何创建BFC？BFC有什么作用？
热门推荐
程序员鱼乐
07-08 1万+
面试官：什么是BFC？BFC有什么特性？如何创建BFC？BFC有什么作用？
BFC
小白向前冲！
06-05 9973
https://blog.csdn.net/liuliuliu_666/article/details/70847566 https://www.w3cplus.com/css/understanding-css-layout-block-formatting-context.html https://developer.mozilla.org/zh-CN/docs/Web/JavaScrip...
面试积累——BFC
Daisy花园
04-12 1633
什么是BFCBFC就是“块级格式化上下文”的意思，创建了 BFC的元素就是一个独立的盒子，不过只有Block-level box可以参与创建BFC， 它规定了内部的Block-level Box如何布局，并且与这个独立盒子里的布局不受外部影响，当然它也不会影响到外面的元素。BFC有一下特性： 内部的Box会在垂直方向，从顶部开始一个接一个地放置。 Box垂直方向的距离由margin决定。属于同一个B
面试必备之--BFC
王亮的博客
05-26 150
1.定义 BFC全称block formatting context(块级格式化上下文) 2.BFC作用 实现更健壮、更智能的自适应布局 解决margin重叠 清除子元素浮动带来的影响 3.如何触发BFC 根元素 float的值不为none overflow的值为auto、scroll、hidden display的值为table-cell、 table-caption、inline-block position的值不为static、 relative 4.实际使用 // 方案1 .left{
关于BFC（前端常见面试题）
banzhangshenlin的博客
07-09 2008
1、什么是BFC？ BFC是一块独立的布局环境，保护其中内部元素不收外部影响，也不影响外部。本身BFC是一种css的布局方式，只是我们可以利用它来解决外边距折叠的问题，BFC并不是专门用来解决这个问题而创的； 2、如何触发BFC？ float的值不是none、position的值不是static或relative 、display的值是inline-block 或 table-cell 或 flex 或 table-caption 或 inline-flex、overflow的值不是visible； 3、B
前端面试必备：HTML5与BFC经典问题解析
面试时可能涉及对BFC的理解，包括它的作用（避免外边距折叠、确保元素独立布局等）、BFC创建条件（如`overflow`设置、浮动元素等），以及如何利用BFC控制元素布局的复杂性。 - BFC的详细解释包括了W3C文档的链接，...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值