当前位置: 首页 > news >正文

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

相关文章:

2.10 CSS BFC

1.简介 BFC是Block Formatting Context(块级格式上下文),可以理解成元素的一个“特异功能”。该“特异功能”,在默认的情况下处于关闭状态;当元素满足了某些条件后,该"特异功能被激活。所谓激活"特异功能”,专业点说就…...

iSlide2024一款基于PPT的插件工具包含38个设计辅助功能

根据使用者情况表明iSlide 是一款拥有30W素材的PPT高效设计软件,可提高90%工作效率,现全球已有超过1400万使用者,智能排版原创高品模板可商用图形,真正摆脱PPT的束缚,把精力用在该用的地方。我们都明白islide插件功能特…...

ATE新能源汽车充电桩自动负载测试系统

随着新能源汽车的普及,充电桩的需求也在不断增加,为了确保充电桩的性能和安全性,对其进行负载测试是非常重要的。ATE新能源汽车充电桩自动负载测试系统是一种专门用于检测充电桩性能的设备,它可以模拟各种实际使用场景&#xff0c…...

机器学习笔记 - 感知器的数学表达

一、假设前提 感知机(或称感知器,Perceptron)是Frank Rosenblatt在1957年就职于Cornell航空实验室(Cornell Aeronautical Laboratory)时所发明的一种人工神经网络。 它可以被视为一种最简单形式的前馈神经网络,是一种二元线性分类模型,其输入为实例的特征向量,输出为实…...

JavaScript 自定义对象

<!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>JS-定义对象</title> </head><body&g…...

UNI-APP_ios自动适应底部安全区背景,修改安全区背景

自动适应&#xff08;推荐&#xff09; 将所有 iPhone X&#xff08;刘海屏) 底部安全区域背景颜色 自动适应&#xff0c;当前页面什么颜色会自动调整。 1.打开 manifest.json &#xff0c;打开源码视图 2.找到 app-plus 配置项&#xff0c;添加以下代码 "safearea&quo…...

微服务的定义

个人理解 其实微服务就是DDD cloud native DDD&#xff1a; 提供了微服务的理论基础&#xff0c;一个大型复杂的服务可以按照其对外提供的业务功能划分成相对独立的小服务。注意这个小是相对而言的&#xff0c;每一个小服务其实就是一个独立的子域(subdomain)&#xff0c;它应…...

什么是C语言中的异常和错误处理机制?

异常和错误处理机制是编程中重要的概念&#xff0c;它们允许您在程序执行过程中处理不可预测的情况和错误。在C语言中&#xff0c;没有内置的异常处理机制&#xff0c;但可以通过一些编程技巧和库来实现错误处理。在本文中&#xff0c;我们将探讨C语言中的异常和错误处理机制&a…...

某某盾-滑块验证-自动获取validate值-(逆向js+python)

我是标题 1.从get&#xff1f;网站获取滑块图片以及token1.1获取fp值1.2 获取cb值1.3 模拟发包 2.获取滑块移动距离3.发包获取最终的validate值3.1轨迹生成3.2 check网站发包3.3 获取data值 4.结论 本实验是根据某某盾示例网站 主要分为两个部分 1.从get&#xff1f;网站获取滑…...

C++:set和map的使用

set和map的使用 1.关联式容器2.key模型和key_value模型3.set3.1一些注意点3.2set的使用3.3习题 4.multiset5.map5.1一些注意点5.2map的使用5.3习题 6.multimap 1.关联式容器 序列式容器&#xff1a;比如我们之前讲的vector、string、list等均为序列式容器&#xff0c;特点是按…...

同城售后系统退款业务重构心得 | 京东云技术团队

一、重构背景 1.1、退款 到家、小时购、天选退款有2套结构&#xff0c;代码逻辑混乱&#xff1b; 其中小时购、天选部分售后单是和平生pop交互退款&#xff0c;部分是和售后中台交互退款&#xff1b;并且兼容3套逻辑&#xff1b; 痛点&#xff1a;代码繁重&#xff0c;缺乏…...

【计算机网络笔记】TCP连接管理(图解三次握手和四次挥手)

系列文章目录 什么是计算机网络&#xff1f; 什么是网络协议&#xff1f; 计算机网络的结构 数据交换之电路交换 数据交换之报文交换和分组交换 分组交换 vs 电路交换 计算机网络性能&#xff08;1&#xff09;——速率、带宽、延迟 计算机网络性能&#xff08;2&#xff09;…...

C++ 初阶 类和对象(中)

前言&#xff1a;C初阶系列&#xff0c;每一期博主都会使用简单朴素的语言将对应的知识分享给大家&#xff0c;争取让所有人都可以听懂&#xff0c;C初阶系列会持续更新&#xff0c;上学期间将不定时更新&#xff0c;但总会更的 目录 一、构造函数 1.1为什么要有构造函数&…...

【漏洞复现】Metinfo5.0.4任意文件包含漏洞复现

感谢互联网提供分享知识与智慧&#xff0c;在法治的社会里&#xff0c;请遵守有关法律法规 文章目录 1、蚁剑直接连接图片马2、读取敏感目录3、读取php源码4、执行PHP命令5、包含木马写Shell &#xff08;图片马制作新方法&#xff09; 以 metinfo_5.0.4为例 该环境的文件上传…...

【计算机网络实验/wireshark】tcp建立和释放

wireshark开始捕获后&#xff0c;浏览器打开xg.swjtu.edu.cn&#xff0c;网页传输完成后&#xff0c;关闭浏览器&#xff0c;然后停止报文捕获。 若捕获不到dns报文&#xff0c;先运行ipconfig/flushdns命令清空dns缓存 DNS报文 设置了筛选条件&#xff1a;dns 查询报文目的…...

STM32:I²C通信原理概要

一、IIC通信原理 IIC通信和串口通信有一定的相似之处&#xff0c;都有一根共地线和两根数据线。但是传递外部信息&#xff0c;串口有两根数据线可以进行双向通信&#xff0c;也就是全双工通信。而在IIC通信下&#xff0c;其中一条数据线是用于提供同步时钟脉冲的时钟线(SCL)&am…...

【开题报告】基于 Spring Boot 的在线预约导游系统的设计与实现

1.引言 在旅游行业中&#xff0c;导游起到了重要的作用&#xff0c;他们为游客提供了专业的旅游服务和相关信息。然而&#xff0c;传统的导游预约方式可能存在一些问题&#xff0c;如信息不透明、预约流程繁琐等。因此&#xff0c;我们计划开发一个基于 Spring Boot 的在线预约…...

如何使用ps制作ico图标文件

如何使用ps制作ico图标文件 Chapter1 如何使用ps制作ico图标文件Chapter2 ICOFormat.8bi&#xff08;Photoshop Ico、Cur插件&#xff09;的下载使用1. ICOFormat.8bi的作用2. ICOFormat.8bi使用 Chapter3 ps手机计算机图标教程,手绘设计精美手机APP软件图标的PS教程步骤 01 制…...

【Linux】logrotate实现“日志文件定时分割“

问题背景 项目部署的过程中&#xff0c;经常会需要查看程序的执行日志。我之前的做法都是用nohup ... > xxx.log 2>&1 &将日志保存到xxx.log文件中的。但是问题是&#xff0c;程序有时会运行很长时间&#xff0c;一直保存在一个文件里&#xff0c;文件会越来越大…...

Android可绘制资源概览(背景、图形等)

关于作者&#xff1a;CSDN内容合伙人、技术专家&#xff0c; 从零开始做日活千万级APP。 专注于分享各领域原创系列文章 &#xff0c;擅长java后端、移动开发、商业变现、人工智能等&#xff0c;希望大家多多支持。 目录 一、导读二、概览三、drawable 分类3.1 Bitmap fileXML …...

Python爬虫实战:研究MechanicalSoup库相关技术

一、MechanicalSoup 库概述 1.1 库简介 MechanicalSoup 是一个 Python 库,专为自动化交互网站而设计。它结合了 requests 的 HTTP 请求能力和 BeautifulSoup 的 HTML 解析能力,提供了直观的 API,让我们可以像人类用户一样浏览网页、填写表单和提交请求。 1.2 主要功能特点…...

React hook之useRef

React useRef 详解 useRef 是 React 提供的一个 Hook&#xff0c;用于在函数组件中创建可变的引用对象。它在 React 开发中有多种重要用途&#xff0c;下面我将全面详细地介绍它的特性和用法。 基本概念 1. 创建 ref const refContainer useRef(initialValue);initialValu…...

服务器硬防的应用场景都有哪些?

服务器硬防是指一种通过硬件设备层面的安全措施来防御服务器系统受到网络攻击的方式&#xff0c;避免服务器受到各种恶意攻击和网络威胁&#xff0c;那么&#xff0c;服务器硬防通常都会应用在哪些场景当中呢&#xff1f; 硬防服务器中一般会配备入侵检测系统和预防系统&#x…...

高危文件识别的常用算法:原理、应用与企业场景

高危文件识别的常用算法&#xff1a;原理、应用与企业场景 高危文件识别旨在检测可能导致安全威胁的文件&#xff0c;如包含恶意代码、敏感数据或欺诈内容的文档&#xff0c;在企业协同办公环境中&#xff08;如Teams、Google Workspace&#xff09;尤为重要。结合大模型技术&…...

3-11单元格区域边界定位(End属性)学习笔记

返回一个Range 对象&#xff0c;只读。该对象代表包含源区域的区域上端下端左端右端的最后一个单元格。等同于按键 End 向上键(End(xlUp))、End向下键(End(xlDown))、End向左键(End(xlToLeft)End向右键(End(xlToRight)) 注意&#xff1a;它移动的位置必须是相连的有内容的单元格…...

2023赣州旅游投资集团

单选题 1.“不登高山&#xff0c;不知天之高也&#xff1b;不临深溪&#xff0c;不知地之厚也。”这句话说明_____。 A、人的意识具有创造性 B、人的认识是独立于实践之外的 C、实践在认识过程中具有决定作用 D、人的一切知识都是从直接经验中获得的 参考答案: C 本题解…...

10-Oracle 23 ai Vector Search 概述和参数

一、Oracle AI Vector Search 概述 企业和个人都在尝试各种AI&#xff0c;使用客户端或是内部自己搭建集成大模型的终端&#xff0c;加速与大型语言模型&#xff08;LLM&#xff09;的结合&#xff0c;同时使用检索增强生成&#xff08;Retrieval Augmented Generation &#…...

PHP 8.5 即将发布:管道操作符、强力调试

前不久&#xff0c;PHP宣布了即将在 2025 年 11 月 20 日 正式发布的 PHP 8.5&#xff01;作为 PHP 语言的又一次重要迭代&#xff0c;PHP 8.5 承诺带来一系列旨在提升代码可读性、健壮性以及开发者效率的改进。而更令人兴奋的是&#xff0c;借助强大的本地开发环境 ServBay&am…...

在 Spring Boot 中使用 JSP

jsp&#xff1f; 好多年没用了。重新整一下 还费了点时间&#xff0c;记录一下。 项目结构&#xff1a; pom: <?xml version"1.0" encoding"UTF-8"?> <project xmlns"http://maven.apache.org/POM/4.0.0" xmlns:xsi"http://ww…...

go 里面的指针

指针 在 Go 中&#xff0c;指针&#xff08;pointer&#xff09;是一个变量的内存地址&#xff0c;就像 C 语言那样&#xff1a; a : 10 p : &a // p 是一个指向 a 的指针 fmt.Println(*p) // 输出 10&#xff0c;通过指针解引用• &a 表示获取变量 a 的地址 p 表示…...