BFC:Block-level box           +   Forating  +           Context;

　-------》块元素          决定其子元素如何定位，及元素关系

-------》“块级格式化上下文”

BFC：就是页面的一个隔离的独立容器，容器里面的子元素不会影响到外面的元素，反之如此（外边也不影响里面）

display：inline-block  阻止嵌套元素margin重叠；

overflow:hidden  超出部分隐藏、  还可以清除内部（float）浮动；

。。。。

10 分钟理解 BFC 原理

前端精选文摘：BFC 神奇背后的原理

BFC原理详解

浅析BFC及其作用

史上最全面、最透彻的BFC原理剖析

【CSS】深入理解BFC原理及应用

BFC原理及其应用

BFC 原理的更多相关文章

  1. CSS 盒模型、解决方案、BFC 原理讲解--摘抄

    PS:内容比较基础,目的只是覆盖面试知识点,大佬可以 history.back(-1) W3C 标准盒模型 & IE 怪异盒模型 页面上显示的每个元素(包括内联元素)都可以看作一个盒子,即盒模 ...

  2. 10分钟理解BFC原理

    10 分钟理解 BFC 原理 一.常见定位方案 在讲 BFC 之前,我们先来了解一下常见的定位方案,定位方案是控制元素的布局,有三种常见方案: 普通流 (normal flow) 在普通流中,元素按照 ...

  3. 前端里神奇的BFC 原理剖析

    以前在做自适应两栏布局的时候别人口中听到bfc这个词,于是看了各种关于bfc的文章,发现梦想天空介绍的不错,今天就在他的基础上润色一下. 一.BFC是什么? 在解释 BFC 是什么之前,需要先介绍 B ...

  4. BFC原理

    一.BFC是什么? 在解释 BFC 是什么之前,需要先介绍 Box.Formatting Context的概念. Box: CSS布局的基本单位 Box 是 CSS 布局的对象和基本单位, 直观点来说 ...

  5. CSS—BFC原理解析与应用

    我们在很多地方都见过BFC这个词,或许能够知道大概意思,但是有时候它的具体原理以及作用会记得很模糊,下面就对BFC这个概念深入学习下. 块级格式化上下文(Block Formatting Contex ...

  6. BFC原理剖析

    本文讲了BFC的概念是什么: BFC的约束规则:咋样才能触发生成新的BFC:BFC在布局中的应用:防止margin重叠(塌陷,以最大的为准): 清除内部浮动:自适应两(多)栏布局. 1. BFC是什么 ...

  7. 10 分钟理解 BFC 原理

    一.常见定位方案 在讲 BFC 之前,我们先来了解一下常见的定位方案,定位方案是控制元素的布局,有三种常见方案: 普通流 (normal flow) 在普通流中,元素按照其在 HTML 中的先后位置至 ...

  8. <HTML/CSS>BFC原理剖析

    本文讲了BFC的概念是什么: BFC的约束规则:咋样才能触发生成新的BFC:BFC在布局中的应用:防止margin重叠(塌陷,以最大的为准): 清除内部浮动:自适应两(多)栏布局. 1. BFC是什么 ...

  9. BFC原理解析

    BFC的概念 块格式化上下文(Block Formatting Context,BFC) 是Web页面的可视化CSS渲染的一部分,是块盒子的布局过程发生的区域,也是浮动元素与其他元素交互的区域. 它是 ...

随机推荐

  1. mssql sqlserver 视图如何加密，让第三方用户查看不到其中的SQL语句

    转自:http://www.maomao365.com/?p=6719 摘要: 下文讲述视图加密的方法分享,通过此方法可以使视图只可使用,无法获取视图中sql脚本的内容,如下所示: 在创建视图的语法中 ...

  2. SQL Server DATA文件夹下audittrace20180124152845_52.trc类文件异常增多

    同事告知某现场SQL Server2008R2数据库的DATA文件夹下audittrace开头的trc文件不断增多,占用较大空间,因此需要关停,尝试解决步骤如下: 1.查看是否有后台开启的trace ...

  3. 阿里云ECS Ubuntu16.0 安装 uwsgi 失败解决方案

    Ubuntu安装包时报错 E:Unable to locate package xxx(如:python3-pip) 一般新安装Ubuntu后需要先更新软件源: apt-get update apt- ...

  4. 制作U盘启动-----计算机经验

    这期呢我就先不打算写关于C的文章,这次就先给大家写几篇关于电脑系统安装的计算机经验篇.希望各位接下来看了我几期的经验文章,你们也能在电脑系统报销之时能够让其满血复活. 制作U盘启动 下载制作U盘启动的 ...

  5. LeetCode算法题-Implement Queue Using Stacks（Java实现）

    这是悦乐书的第195次更新,第201篇原创 01 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第57题(顺位题号是232).使用栈实现队列的以下操作. push(x) - 将元素x推 ...

  6. IIS 发布ASP.NET MVC 4.0 错误500.21解决办法

    由VS2013 写好的MVC 4.0 发布在服务器IIS 上报错500.21,解决办法:尝试多种网上介绍的办法,最后发现还是模块问题.

  7. hover效果的几种方式

    1.改变透明度 #share_wrap a{display: inline-block;width: 48px;height: 44px;background: url(/images/finance ...

  8. C#反射の反射接口

    C#反射の反射详解(点击跳转)C#反射の反射接口(点击跳转)C#反射反射泛型接口(点击跳转)C#反射の一个泛型反射实现的网络请求框架(点击跳转) 上一篇中叙述了反射的情况,下面主要讲一些反射的实际用途 ...

  9. centos7下安装docker（17.1docker监控---sysdig）

    sysdig是一个轻量级的系统监控工具,同时原生支持容器.通过sysdig我们可以近距离观察linux操作系统和容器的行为 Linux上有很多常用的监控工具,比如;strace,tcpdump,hto ...

  10. tomcat的webapps目录中的abc.war

    1  在tomcat的webapps目录中,会有类似abc.war类型的文件,在tomcat启动时会自动解压为abc目录. 2  如果tomcat在运行中,不要直接删除abc.war文件,删除后,ab ...