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内,盒子会一个挨着一个的排,相邻盒子 ...
随机推荐
- linux网卡驱动程序架构
以cs89x0网卡驱动为例:
- day54 Pyhton 前端JS06
内容回顾 - ECMAScript5.0 基础语法 - var 声明变量 - 五种基本数据类型 - string - number NaN number 1 number - boolean - un ...
- 扫描仪扫描文件处理-图像扫描加工到生成PDF步骤简述[JAVA版]
另参见:https://www.cnblogs.com/whycnblogs/p/8034276.html 详细见:https://github.com/barrer/scan-helper 用途: ...
- centos8平台使用lsof
一,lsof的用途 lsof,List Open Files 列出当前系统打开文件的工具. 在linux环境下,任何事物都以文件的形式存在, 所以lsof通过文件不仅仅可以访问常规数据,还可以访问网络 ...
- C# 使用MySQL事务的使用方法
//使用事务来处理多条数据,如果不成功则回滚 public void getCheckListSubmit() { string _conStr = "................&qu ...
- 小C和小派的缠绵爱情——C语言调用Python代码
我妒忌你的开源,你眼红我的速度,不如我们就在一起吧! --------SJ2050 2019.4.9号更新:实现在未安装python环境的机子上运行调用了python程序的C语言代码! 文章目录 环境 ...
- linux 手动配置ip地址方法
手工配置静态的IP地址 也就是手工配置IP地址.子网掩码.网关和DNS. 设置方法如下: vi /etc/sysconfig/network-scripts/ifcfg-eth0 编辑本地网卡的配置文 ...
- DRF (学习第一部)
目录 Web应用模式 API接口 RESTful API 规范 序列化 Django Rest_Framework 环境安装预与配置 序列化器 -Serializer Web应用模式 在开发web应用 ...
- 给定 n 个字符串,求有多少字符串是其他字符串的前缀。
1 #include <cstdio> 2 #include <set> 3 #include <iostream> 4 #include <cstring& ...
- 手写webpack核心原理,再也不怕面试官问我webpack原理
手写webpack核心原理 目录 手写webpack核心原理 一.核心打包原理 1.1 打包的主要流程如下 1.2 具体细节 二.基本准备工作 三.获取模块内容 四.分析模块 五.收集依赖 六.ES6 ...