zoukankan      html  css  js  c++  java
  • BFC布局规则以及触发条件

    含义:

    所谓FBC全称Block Formatting Contexts(BFC),又叫块级元素格式化上下文,它决定了块级元素如何对他的内容进行布局,以及和其他元素的关系的相互关系。BFC是个独立的空间,里面的元素和外面的元素不会互相影响。

    触发条件(以下任意其一满足即可):

    1.float浮动的值不为none。

    2.overflow溢出隐藏的值不为visible。

    3.display的值为table-cell、table-caption和inline-block之一。

    4.position的值不为static或releative中的任何一个。

    BFC布局和普通文档流布局的区别:

    普通文档流布局规则

    1.浮动的元素是不会被父级计算高度

    2.非浮动元素会覆盖浮动元素的位置

    3.margin会传递给父级

    4.两个相邻元素上下margin会重叠

    BFC布局规则

    1.浮动的元素会被父级计算高度(父级触发了BFC)

    2.非浮动元素不会覆盖浮动元素位置(非浮动元素触发了BFC)

    3.margin不会传递给父级(父级触发了BFC)

    4.两个相邻元素上下margin会重叠(给其中一个元素增加一个父级,然后让他的父级触发BFC)

  • 相关阅读:
    MySQL(DQL部分)
    Java函数式接口
    Java简易版生产者消费者模型
    浅谈Java三种实现线程同步的方法
    Linux常用命令
    计算机组成原理笔记
    资煌麻辣烫——事后诸葛亮
    资煌麻辣烫——冲刺集合
    资煌麻辣烫——测试总结
    资煌麻辣烫——冲刺总结
  • 原文地址:https://www.cnblogs.com/lmm1010/p/13182800.html
Copyright © 2011-2022 走看看