2.10 CSS BFC

1.简介
  • BFC是Block Formatting Context(块级格式上下文),可以理解成元素的一个“特异功能”。
  • 该“特异功能”,在默认的情况下处于关闭状态;当元素满足了某些条件后,该"特异功能被激活。
  • 所谓激活"特异功能”,专业点说就是:该元素创建了BFC (又称: 开启了BFC)。
2.BFC的作用
  • 元素开启BFC后,其子元素不会再产生margin塌陷问题。
  • 元素开启BFC后,自己不会被其他浮动元素所覆盖。
  • 元素开启BFC后,就算其子元素浮动,元素自身高度也不会塌陷。
3.开启BFC
  • 根元素
  • 浮动元素
  • 绝对定位、固定定位的元素
  • 行内块元素
  • 表格单元格: table、 thead、 tbody、 tfoot、 th、 td、 tr 、caption
  • overflow的值不为visible 的块元素
  • 伸缩项目
  • 多列容器
  • column-span为all 的元素(即使该元素没有包裹在多列容器中)
  • display的值,设置为flow- root

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/131526.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

京东数据平台:2023年Q3季度黄金市场数据分析

继9月国内黄金市场持续上涨后,进入10月中下旬后,黄金行情再度反转,多家品牌金饰价格再次突破600元/克,达到611元/克。 今年以来,黄金行情不断走俏,销售市场也有明显增长。根据鲸参谋平台的数据显示&#xf…

微服务之Eureka

文章目录 一、Eureka介绍1.Eureka的作用2.总结 二.搭建Eureka服务端步骤1.导入maven依赖2.编写启动类,添加EnableEurekaServer注解3.添加application.yml文件,编写下面的配置: 三.注册Eureka客户端服务提供者(user-service&#x…

Amlogic IR模块Linux驱动分析

目录 一、简介 1、了解IR协议 2、代码结构介绍 二、硬件原理及连接 2、芯片手册解读 三、驱动代码分析 1、设备树介绍 1)reg 2)protocol 3)pinctrl 4)map 2、linux驱动介绍 1)makefile 2)数据…

C语言——选择排序

完整代码: //选择排序 // 选择排序是一种简单直观的排序算法。它的工作原理如下:首先在未排序序列中找到最小(大)元素,存放到排序序列的起始位置,然后,再从剩余未排序元素中继续寻找最小(大&am…

嵌入式中如何将BootLoader与APP合并成一个固件

1、前言 嵌入式固件一般分为BootLoader和App,BootLoader用于启动校验、App升级、App版本回滚等功能,BootLoader在cpu上电第一阶段中运行,之后跳转至App地址执行应用程序。 因此,在发布固件的时候,会存在BootLoader固件…

广汽传祺E9上市,3DCAT实时云渲染助力线上3D高清看车体验

今年5月21日,中国智电新能源旗舰MPV——广汽传祺智电新能源E9在北京人民大会堂举办上市发布会。 发布会现场(图源官方) 为了让更多的消费者能够在线上感受到广汽传祺E9的魅力,3DCAT实时渲染云与大圣科技合作为广汽传祺打造了一款…

python模块的介绍和导入

python模块的介绍和导入 概念 在Python中,每个Python代码文件都是一个模块。写程序时,我们可以将代码分散在不同的模块(文件)中,然后在一个模块中引用另一个模块的内容。 导入格式 1、在一个模块中引用(导入)另一个模块可以使用import语句…

List 接口常用实现类底层分析

一、集合 1.1 简介 集合主要分为两组(单列集合、双列集合),Collection 接口有两个重要的子接口 List 和Set,它们的实现子类都是单列集合。Map 接口的实现子类是双列集合,存放的是 K-V 1.2 关系图 二、Collection 接口…

el-table样式

1、实现效果,外部框是蓝绿色边框,深色背景,里面的表格首先设置透明色,然后应用自定义斑马纹。 2、代码 template代码,其中样式frameBordStyle是深色背景框,不负责表格样式,表格样式由tableStyl…

操作系统——初始文件管理(王道视频p58)

1.总体概述: 这一节,主要是 作为 后续 “文件系统”的引子 我认为可以思考的点: (1)文件之间的逻辑结构——windows中采用根什么的“树状结构”,而文件在外存中的实际物理结构又是什么样的 &#xff08…

差生文具多之(一)eBPF

前言 在问题排查过程中, 通常包含: 整体观测, 数据采集, 数据分析这几个阶段. 对于简单问题的排查, 可以跳过前两个步骤, 无需额外收集数据, 直接通过分析日志中的关键信息就可以定位根因; 而对于复杂问题的排查, 为了对应用的行为有更完整的了解, 可以通过以下形式收集更多的…

Python---字符串中的查找方法--index()--括号里是要获取的字符串

index()方法其功能与find()方法完全一致,唯一的区别在于当要查找的子串没有出现在字符串中时,find()方法返回-1,而index()方法则直接 报错。 find()方法相关链接:Python---字符串中的查找方法--find()--括…

postMessage

A:端口3000 import React, { useEffect } from react;function App() {useEffect(() > {const childWindow document.getElementById(child).contentWindow;const sendMessageToChild () > {childWindow.postMessage("主页面消息", "http://localhost:…

【电路笔记】-谐波

谐波 文章目录 谐波1、概述2、频谱分析3、已知信号4、未知信号5、总结 周期性信号并不总是完美的正弦模式,例如我们之前有关 正弦波的文章之一中介绍的那样。 有时,信号确实可以是简单正弦波的叠加,它们被称为复杂波形。 在本文中&#xff0…

【C语法学习】17 - fwrite()函数

文章目录 1 函数原型2 参数3 返回值4 示例 1 函数原型 fwrite():将ptr指向的内存空间中储存的数据块写入与指定流stream相关联的二进制文件中,函数原型如下: size_t fwrite(const void *ptr, size_t size, size_t count, FILE *stream)2 参…

基于stm32F4的智能宠物喂食器的设计:LVGL界面、定时喂食喂水通风

宠物喂食器 一、功能设计二、元器件选型三、UI设计四、原理图设计五、源代码设计六、成品展示 实物链接:https://m.tb.cn/h.5iCUX6H?tkPL65WXCEipQ CZ3457 一、功能设计 1、设计一个触摸屏作为人机交互 2、通过触摸屏设置时间定时喂食喂水通风 3、获取当前水槽的…

没想到这么齐全!这份 Python 实战干货yyds

今天我分享一些Python学习神器资料,有需要的小伙文末自行免费领取。 1.200Python练手案例: 2.Python全套视频教程等: 3.浙大Python学习套装: * 4.Python实战案例: 5.Pandas学习大礼包 6.学习手册大礼包 Python知识…

2023年【熔化焊接与热切割】免费试题及熔化焊接与热切割考试总结

题库来源:安全生产模拟考试一点通公众号小程序 熔化焊接与热切割免费试题参考答案及熔化焊接与热切割考试试题解析是安全生产模拟考试一点通题库老师及熔化焊接与热切割操作证已考过的学员汇总,相对有效帮助熔化焊接与热切割考试总结学员顺利通过考试。…

单链表的应用(2)

环形链表的约瑟夫问题 编号为 1 到 n 的 n 个人围成一圈。从编号为 1 的人开始报数,报到 m 的人离开。 下一个人继续从 1 开始报数。 n-1 轮结束以后,只剩下一个人,问最后留下的这个人编号是多少? 利用链表实现 思路&#xff1…