CSS 包含块

前言:CSS 总的来说就两块,样式计算和视觉格式化模型,而包含块就是视觉格式化模型的重要内容,理解包含块的定义,对于 CSS 布局有更好的帮助。

1. 概念

什么叫包含块,指的是一个区域,某一个元素在这个区域的排列,这个元素的宽度,高度,left,top 是相对于这个区域的。而这个区域就叫作这个元素的包含块。

2. 包含块的确定规则

  1. 如果一个元素是浮动元素或常规元素他的包含块是父元素的内容盒。
  2. 如果一个元素是绝对定位元素他的包含块是第一个定位祖先的填充盒。
  3. 如果一个元素是固定定位元素且他的祖先元素里面没有 transform 变形样式,那他的包含块是整个视图窗口。如果祖先元素有 transform 变形样式。那他的包含块就是设置了 transform 变形样式的填充盒子。

3. 面试问题

绝对定位元素和固定定位元素的区别是什么?

答案:包含块不一样。

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

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

相关文章

azkaban-tools 项目介绍

本文背景 应一个用户的好心和好奇心,在最近水深火热的百忙之中抽时间写完了一个简短的项目介绍,其实就是几个azkaban的批量操作脚本,但在大数据集群的“运维生涯”中,还是帮了自己不少忙,也算是为了它做一个简单的回顾…

软件设计师考试——加密算法(对称,非对称)、重放攻击、内聚模式、scrum模型、CMM模型、MVC模式、桥接模式与适配器模式、事务具有的特性

加密算法 对称加密算法: 介绍:使用相同的密钥进行加密和解密。常见的对称加密算法包括DES、AES等。特点:加密和解密速度快,适合大数据量的加密;密钥管理相对简单。使用场合:适合于对数据进行加密传输或存储…

linux中passwd --stdin命令含义

linux中passwd --stdin命令的含义 在linux系统中,我们知道passwd是用来修改用户密码的命令。而--stdin是passwd命令的一个选项,用于从标准输入中读取密码。具体来说,使用passwd --stdin可以将标准输入中的内容作为新密码,通过管道…

如何在线教育系统解决方案,微信视频号运营技巧有哪些?哪些内容比较受欢迎?

微信视频号是一个机会,要做好它的秘诀就是内容好、能抓人、整合推,除了利用渠道红利,来打通朋友圈、微信群等来进行推广之外,重点还要抓内容。切中用户痛点,制造冲突和反转,引发观众内容的思考和互动&#…

LeetCode力扣第114题:多种算法实现 将二叉树展开为链表

作者介绍:10年大厂数据\经营分析经验,现任大厂数据部门负责人。 会一些的技术:数据分析、算法、SQL、大数据相关、python 欢迎加入社区:码上找工作 作者专栏每日更新: LeetCode解锁1000题: 打怪升级之旅 python数据分析…

目标检测YOLO实战应用案例100讲-基于深度学习的交通场景多尺度目标检测算法研究与应用(下)

目录 3.2 基于空洞卷积的特征融合模块设计 3.3 改进k-means聚类算法的anchor尺寸优化设计

微调大模型学习记录

微调大模型基本思路 一般来说, 垂直领域的现状就是大家积累很多垂域数据,从现实出发,第一步可以先做增量训练.所以会把模型分成3个阶段: (1)、第一阶段:(Continue PreTraining)增量预训练,在海量领域文档数据(领域知识)上二次预训练base模型…

Java | Leetcode Java题解之第85题最大矩形

题目&#xff1a; 题解&#xff1a; class Solution {public int maximalRectangle(char[][] matrix) {int m matrix.length;if (m 0) {return 0;}int n matrix[0].length;int[][] left new int[m][n];for (int i 0; i < m; i) {for (int j 0; j < n; j) {if (mat…

Python3 + Appium + 安卓模拟器实现APP自动化测试并生成测试报告

这篇文章主要介绍了Python3 Appium 安卓模拟器实现APP自动化测试并生成测试报告,本文给大家介绍的非常详细&#xff0c;对大家的学习或工作具有一定的参考借鉴价值&#xff0c;需要的朋友可以参考下 本文主要分为以下几个部分 安装Python3 安装Python3的Appium库 安装Andr…

Mp3tag for Mac:音乐标签,轻松管理

还在为杂乱无章的音乐文件而烦恼吗&#xff1f;Mp3tag for Mac&#xff0c;让您的音乐库焕然一新&#xff01;它支持多种音频格式&#xff0c;批量编辑标签&#xff0c;让音乐管理变得简单高效。同时&#xff0c;自动获取在线数据库的音乐元数据&#xff0c;确保您的音乐库始终…

优选算法——双指针

优选算法 一、leetcode283.移动零 题目分析&#xff1a; ​ 给定一个数组 nums&#xff0c;编写一个函数将所有 0 移动到数组的末尾&#xff0c;同时保持非零元素的相对顺序。 算法原理&#xff1a; ​ 快排原理&#xff1a; ​ 数组划分或者数组分块&#xff1a;即在一定…

docker 开启 tcp 端口

前言&#xff1a;查了很多网上资料 都说要修改daemons,json 完全不管用&#xff0c;而且还导致添加 {“host”:["tcp://0.0.0.0:2375","unix:///var/lib/docker.sock"]} 后&#xff0c;docker restart 失败&#xff0c;浪费了不少时间 &#xff01;&am…

基于物理的渲染的光照参数

基于物理的渲染通常使用更加真实和复杂的光照模型&#xff0c;其中包括一系列物理参数来模拟光线在场景中的传播和反射。以下是一些常见的基于物理的渲染光照参数&#xff1a; 环境光&#xff08;Ambient Light&#xff09;&#xff1a;环境光在基于物理的渲染中仍然存在&#…

kafka安装配置及集成springboot

1. 安装 单机安装kafka Kafka对于zookeeper是强依赖&#xff0c;保存kafka相关的节点数据&#xff0c;所以安装Kafka之前必须先安装zookeeper dockerhub网址: https://hub.docker.com Docker安装zookeeper 下载镜像&#xff1a; docker pull zookeeper:3.4.14创建容器 doc…

docker(五):DockerFile

文章目录 DockerFile1、Dockerfile构建过程解析2、DockerFile常用保留字命令FROMMAINTAINERRUNEXPOSEWORKDIRUSERENVADDCOPYVOLUMECMDENTRYPOINT总结 3、案例 DockerFile 1、Dockerfile构建过程解析 官网文档&#xff1a;https://docs.docker.com/reference/dockerfile/ Dock…

【论文阅读笔记】HermesSim(Code is not Natural Language) (Security 24)

个人博客地址 HermesSim [Security 24] 论文&#xff1a;《Code is not Natural Language: Unlock the Power of Semantics-Oriented Graph Representation for Binary Code Similarity Detection》 仓库&#xff1a;https://github.com/NSSL-SJTU/HermesSim 提出的问题 二…

JVM调优:JVM中的垃圾收集器详解

JVM&#xff08;Java Virtual Machine&#xff09;垃圾收集器是Java虚拟机中的一个重要组件&#xff0c;负责自动管理Java堆内存中的对象。垃圾收集器的主要任务是找出那些不再被程序使用的对象&#xff0c;并释放它们占用的内存&#xff0c;以便为新的对象分配空间。这个过程被…

C#泛型委托

在C#中&#xff0c;delegate 关键字用于声明委托&#xff08;delegates&#xff09;&#xff0c;委托是一种类型安全的函数指针&#xff0c;允许你传递方法作为参数或从方法返回方法。有时我们需要将一个函数作为另一个函数的参数&#xff0c;这时就要用到委托&#xff08;Dele…

算法题② —— 链表专栏

1. 链表数据结构 struct ListNode {int val;ListNode *next;ListNode() : val(0), next(nullptr) {}ListNode(int x) : val(x), next(nullptr) {}ListNode(int x, ListNode *next) : val(x), next(next) {}};2. 链表的删除 2.1 移除链表元素 力扣&#xff1a;https://leetco…

常见的自定义类加载器实现策略

1、从特定路径加载类&#xff1a; 这种策略允许类加载器从文件系统上的特定目录或JAR文件中加载类。例如&#xff0c;可以将应用程序的插件或扩展放在特定的目录中&#xff0c;并使用自定义类加载器动态加载它们。 2、从网络加载类&#xff1a; 自定义类加载器可以从远程服务…