css布局中的BFC
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的更多相关文章
- 认识和理解css布局中的BFC
认识和理解css布局中的BFC BFC的定义 是 W3C CSS 2.1 规范中的一个概念,它决定了元素如何对其内容进行定位,以及与其他元素的关系和相互作用. Block Formatting Con ...
- DIV+CSS布局中主要CSS属性介绍
Float: Float属性是DIV+CSS布局中最基本也是最常用的属性,用于实现多列功能,我们知道<div>标签默认一行只能显示一个,而使用Float属性可以实现一行显示多个div的功能 ...
- CSS布局中的水平垂直居中
CSS布局中的水平垂直居中 各位好,先说两句题外话.今天是我开通博客园的博客第一天,虽然我申请博客园的账号已经有一年半了,但是由于各种原因迟迟没有开通自己的博客.今天非常有幸开通博客,在此也写一篇关于 ...
- DIV CSS布局中position属性用法深入探究
本文向大家描述一下DIV CSS布局中的position属性的用法,position属性主要有四种属性值,任何元素的默认position的属性值均是static,静态.这节课主要讲讲relative( ...
- DIV CSS布局中绝对定位和浮动用法
转自:http://developer.51cto.com/art/201009/223337_1.htm 你对DIV CSS布局中绝对定位和浮动的概念及使用是否熟悉,这里和大家分享一下,CSS中,实 ...
- DIV+CSS布局中自适应高度的解决方法
div乱跑问题 (文件<DIV+CSS布局中自适应高度的解决方法.rar>) float 是个很危险的东西 得小心使用 本来有一很好的关于CSS+DIV的论坛 不过现在关门了 甚是可 ...
- CSS布局中最小高度的妙用
CSS布局中最小高度的妙用 --最小高度可以设定一个BOX的最小高度,当其内容较少时时,也能保持BOX的高度为一定,超出就自动向下延伸最小高度可以设定一个BOX的最小高度,当其内容较少时时,也能保持B ...
- CSS布局中——导航是非常常见的
导航绝对是页面布局中最常见的,为了不用每次去写,稍微贴个简单的导航模版出来,方便以后使用. <title>CSS菜单</title> <style type=" ...
- CSS布局中一个简单的应用BFC的例子
什么是BFC BFC(Block Formatting Context),简单讲,它是提供了一个独立布局的环境,每个BFC都遵守同一套布局规则.例如,在同一个BFC内,盒子会一个挨着一个的排,相邻盒子 ...
随机推荐
- docker容器命令2
docker容器命令2 启动守护式容器 docker run -d 镜像名字 [root@tzh ~]# docker images REPOSITORY TAG IMAGE ID CREATED S ...
- 左叶子之和(sum-of-left-leaves)
LeetCode题目--左叶子之和(sum-of-left-leaves) 计算给定二叉树的所有左叶子之和. 示例: 3 / \ 9 20 / \ 15 7 在这个二叉树中,有两个左叶子,分别是 9 ...
- 跨境 TCP 传输优化实录 — 使用 BBR 解决 LFN 问题
背景 近期开通了一条访问美国机房的 1G 专线,用于提供行情数据备源,并基于 TCP 建立了一套数据传输服务.上线后发现一个严重的问题:应用程序发送队列中的数据大量积压,最终导致程序 OOM Kill ...
- 多测师讲解python _类(原始版)_高级讲师肖sir
# Python中的类: '''定义一个类:class +名称=类 在类当中定义:def +名称=实例方法(self)与类平齐def +名称=普通函数定义一个函数:def +名称=函数在函数中:函数( ...
- Git之多人协同开发
一.获取远程库信息 1 2 3 $ git remote -v origin https://github.com/xxxxx/node.git (fetch) origin https://gi ...
- 联赛%你测试10T2:漫无止境的八月
题意: 思路: 有几个特殊的性质: 在不考虑q里面的单点修改,我们先只判断一个序列是否Yes. 我们注意到每次操作都是对一个长度为k的区间进行区间加减1的操作,所以我们如果将序列里面的数按%k分组,把 ...
- centos8平台使用wkhtmltopdf实现html网页转pdf
一,wkhtmltopdf的用途 wkhtmltopdf可以直接把任何一个可以在浏览器中浏览的网页直接转换成一个pdf 说明:刘宏缔的架构森林是一个专注架构的博客,地址:https://www.cnb ...
- JavaScript的9大排序算法详解
一.插入排序 1.算法简介 插入排序(Insertion-Sort)的算法描述是一种简单直观的排序算法.它的工作原理是通过构建有序序列,对于未排序数据,在已排序序列中从后向前扫描,找到相应位置并插入. ...
- sql左连接查询+右表带有条件的实现
select * from A表 a left join B表 b on a.id=b.a_id and b.字段='/*条件*/' ; 可查出左表所有数据 select * from A表 a le ...
- liunx命令的运用
工作中用到了一些命令,记忆才深刻 1.查看服务器内存:free -h 2.查看服务器磁盘空间:df -h 3.切root用户:sudo su root 输入密码 4.查看liunx服务器下的所有用户: ...