1、BFC的区域会与float的元素区域重叠

2、计算BFC的高度时,浮动子元素也参与计算

3、BFC就是页面上的一个隔离的独立容器,容器里面的子元素是不会影响到外面的元素

4、BFC意为”块级格式化上下文”
   答案:1
   解析:
     BFC全称”Block Formatting Context”, 中文为“块级格式化上下文”。
     BFC元素特性表现原则就是,内部子元素再怎么翻江倒海,翻云覆雨都不会影响外部的元素。所以,避免margin穿透啊,清除浮动什么的也好理解了。

什么时候会触发BFC呢?
常见的如下: float的值不为none。 overflow的值为auto,scroll或hidden。
display的值为table-cell, table-caption, inline-block中的任何一个。
position的值不为relative和static。

css布局中的BFC的更多相关文章

  1. 认识和理解css布局中的BFC

    认识和理解css布局中的BFC BFC的定义 是 W3C CSS 2.1 规范中的一个概念,它决定了元素如何对其内容进行定位,以及与其他元素的关系和相互作用. Block Formatting Con ...

  2. DIV+CSS布局中主要CSS属性介绍

    Float: Float属性是DIV+CSS布局中最基本也是最常用的属性,用于实现多列功能,我们知道<div>标签默认一行只能显示一个,而使用Float属性可以实现一行显示多个div的功能 ...

  3. CSS布局中的水平垂直居中

    CSS布局中的水平垂直居中 各位好,先说两句题外话.今天是我开通博客园的博客第一天,虽然我申请博客园的账号已经有一年半了,但是由于各种原因迟迟没有开通自己的博客.今天非常有幸开通博客,在此也写一篇关于 ...

  4. DIV CSS布局中position属性用法深入探究

    本文向大家描述一下DIV CSS布局中的position属性的用法,position属性主要有四种属性值,任何元素的默认position的属性值均是static,静态.这节课主要讲讲relative( ...

  5. DIV CSS布局中绝对定位和浮动用法

    转自:http://developer.51cto.com/art/201009/223337_1.htm 你对DIV CSS布局中绝对定位和浮动的概念及使用是否熟悉,这里和大家分享一下,CSS中,实 ...

  6. DIV+CSS布局中自适应高度的解决方法

    div乱跑问题  (文件<DIV+CSS布局中自适应高度的解决方法.rar>)   float 是个很危险的东西 得小心使用 本来有一很好的关于CSS+DIV的论坛 不过现在关门了 甚是可 ...

  7. CSS布局中最小高度的妙用

    CSS布局中最小高度的妙用 --最小高度可以设定一个BOX的最小高度,当其内容较少时时,也能保持BOX的高度为一定,超出就自动向下延伸最小高度可以设定一个BOX的最小高度,当其内容较少时时,也能保持B ...

  8. CSS布局中——导航是非常常见的

    导航绝对是页面布局中最常见的,为了不用每次去写,稍微贴个简单的导航模版出来,方便以后使用. <title>CSS菜单</title> <style type=" ...

  9. CSS布局中一个简单的应用BFC的例子

    什么是BFC BFC(Block Formatting Context),简单讲,它是提供了一个独立布局的环境,每个BFC都遵守同一套布局规则.例如,在同一个BFC内,盒子会一个挨着一个的排,相邻盒子 ...

随机推荐

  1. if-else和if if的对比

  2. python与嵌入式的火花

    一.前言 近些年来python非常流行,Python是一种面向对象的解释性计算机程序设计语言,Python语法简介清晰,易读性以及可扩展性,Python具有丰富和强大的库,能够把用其他语言制作的各种模 ...

  3. C语言编程丨循环链表实现约瑟夫环!真可谓无所不能的C!

    循环链表   把链表的两头连接,使其成为了一个环状链表,通常称为循环链表. 和它名字的表意一样,只需要将表中最后一个结点的指针指向头结点,链表就能成环儿,下图所示.   需要注意的是,虽然循环链表成环 ...

  4. java9第5篇-Collection集合类的增强与优化

    我计划在后续的一段时间内,写一系列关于java 9的文章,虽然java 9 不像Java 8或者Java 11那样的核心java版本,但是还是有很多的特性值得关注.期待您能关注我,我将把java 9 ...

  5. es 讲义

    链接: https://pan.baidu.com/s/193jObXs85OZcvAHDycUXlw 提取码: ewbp

  6. linux(centos8): 临时关闭/永久关闭交换分区swap?

    一,为什么要关闭swap? 1,swap的用途? swap 分区就是交换分区,(windows平台叫虚拟内存) 在物理内存不够用时, 操作系统会从物理内存中把部分暂时不被使用的数据转移到交换分区, 从 ...

  7. centos8平台使用parted管理分区

    一,parted的用途 parted是GNU发布的强大的分区工具, parted命令可以划分单个分区大于2T的GPT格式的分区,也可以划分普通的MBR分区. 因为fdisk命令对于大于2T的分区无法划 ...

  8. Jmeter入门(2)- 基本使用

    一. JMeter入门脚本 学习例子 向百度发送请求 添加测试计划,默认会有一个测试计划 添加线程组 在测试计划上右键 ==> 添加 ==> 线程(用户) ==> 线程组 添加HTT ...

  9. readcf: option RunAsUser: unknown user smmsp发送邮件失败问题

    今天使用mail命令发送邮件时,发送不了,错误信息如下: /etc/mail/submit.cf: line 432: readcf: option RunAsUser: unknown user s ...

  10. apktool重新打包添加签名

    一.生成apk apktool b 反编译后项目目录 -o 新apk名称.apk 二.生成签名 keytool -genkeypair -alias 新apk名称.apk -keyalg RSA -v ...