1.BFC 全称是块级排版上下文,用于对块级元素排版,默认情况下只有根元素(body)一个块级上下文,但是如果一个块级元素 设置了float:left,overflow:hidden或position:absolute样式,就会为这个块级元素生成一个独立的块圾上下文,就像在window全局作用域内,声明了一个function就会生成 一个独立的作用域一样,新开僻的BFC像是开僻了一个新的小宇宙,使这个块圾元素内部的排版完全独立隔绝。
    2.独立的块级上下文可以包裹浮动流,全部浮动子元素也不会引起容器高度塌陷,也就是说包含块会把浮动元素的高度也计算在内,所以不用清除浮动来撑起高度。

BFC块级排版上下文的更多相关文章

  1. CSS2系列:BFC(块级格式化上下文)IFC(行级格式化上下文)

    BFC 块级格式化上下文,不好理解,我们暂且把她理解成"具有特殊的一类元素" 哪些元素会生成BFC? 根元素 float属性不为none position为absolute或fix ...

  2. BFC块级格式上下文

    BFC块级格式上下文,独立的一个渲染区域 1.同一个BFC的两个相邻盒子间的margin会重叠(垂直方向): 2.BFC内部的盒子在垂直方向上会一个接一个的放置: 3.每个子元素的左外边距与包含块的左 ...

  3. BFC块级格式化上下文

    BFC块级格式化上下文 触发条件 overflow 值不为 visible 的块元素 根元素 html 元素 浮动元素(元素的 float 不是 none) 绝对定位元素(元素的 position 为 ...

  4. BFC——块级格式化上下文

    BFC(块级格式化上下文) 一.BFC是什么? 从样式上看,具有BFC的容器和普通的容器没有区别.从功能上看,具有BFC的容器可以看作是隔离了的容器,容器里面的元素不会影响到外面的元素,并且BFC具有 ...

  5. BFC块级格式化上下文简述

    做过页面编写的各位应该对定位不陌生了,这个样式表中的重头戏,也是最难把控的元素之一,今天在这里我们要讲到的就是与浮动与清除浮动相关的定位元素,对于定位有很多种,有绝对定位,还有相对定位,固定定位,静态 ...

  6. 我理解的BFC(块级格式化上下文)

    BFC(Block formatting context) 直译为"块级格式化上下文". BFC它是一个独立的渲染区域,只有Block-level box参与, 它规定了内部的Bl ...

  7. 理解CSS中的BFC(块级可视化上下文)[译]

    开篇 一些元素,如float元素,如position为absolute,inline-block,table-cell或table-caption的元素,以及overflow属性不为visible的元 ...

  8. BFC块级格式上下文介绍

    块级格式上下文(Block formatting context) 什么是BFC? 块格式化上下文(block formatting context) 是页面 CSS视觉渲染的一部分.它是用于决定块盒 ...

  9. BFC(块级格式化上下文)

    转载自:https://www.cnblogs.com/asheng2016/p/7281784.html https://blog.csdn.net/jiaojsun/article/details ...

随机推荐

  1. C盘扩容,超详细,史上最简单的扩容技术贴!

    http://ideapad.zol.com.cn/55/160_549015.html 很多朋友跟我一样,转到windows 7 64bit后,发现以前所谓的35GB理论不够用了,哪怕你不把任何程序 ...

  2. Asp.Net使用Bulk批量插入数据

    using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Di ...

  3. 安装Cocoapoads遇到的问题的解决办法

    错误一.首先来个错误截图

  4. hadoop压缩配置

    为何要使用压缩,压缩可以是文件的大小减小很多,节省空间:另外压缩后的文件在传输时更节省带宽. 所需软件: 1)lzo 2)hadoop-lzo 3)maven 安装编译: 1)lzo wget htt ...

  5. linux修改rm指令执行(数据安全)

    引用文章A:http://hi.baidu.com/jlusuoya/item/32ae398958088755840fabfb 引用介绍:将rm替换为mv. 引用文章B:http://blog.cs ...

  6. ZendStudio10 代码格式化 xml

    <?xml version="1.0" encoding="UTF-8" standalone="no"?> <profi ...

  7. Android 使用BroadcastReceiver的几种方法

    发送自定义广播 全局广播 发送标准广播 1.定义广播接收器.(在发送广播前,需要先定义一个广播接收器,不然发了也是白发) public class MyBroadcastReceiver extend ...

  8. ThinkPHP框架二

    ThinkPHP笔记二 1.1 TP框架的配置文件 在TP框架中,所有的配置文件都是自动加载的,加载的顺序:惯例配置<应用配置<调试配置<模块配置<动态配置 1. 惯例配置(T ...

  9. Linux下vim文件未正常退出,修复文件

    Linux下vim文件未正常退出,会产生一个 .文件名.swp的文件 ls -al  ,rm   删掉.swp文件 之后就可以正常使用文件了

  10. ios显示手机信息

    NSString *strname=[[UIDevice currentDevice] name]; NSLog(@"设备名:%@",strname); NSString *str ...