1.初始包含块，浏览器viewport大小

2.非根元素，position：relative/static，包含块为最近的块级框，表格单元或行内祖先框的内容区

3.非根元素，position：absolute，包含块为最近的position不是static的祖先元素，没有的话就是初始包含块

　　　　- 若祖先为块级元素，包含块为祖先块从border的内边界以内的部分，即padding+context

　　　　- 若为行内元素，根据文字方向确定。从左向右内容区左上角和右下角确定的框；从右向左为右上角和左下角确定的内容区

CSS中的包含块的更多相关文章

  1. CSS学习笔记——包含块 containing block

    以下内容翻译自CSS 2.1官方文档.网址:https://www.w3.org/TR/CSS2/visudet.html#strut 有时,一个元素的盒子的位置和尺寸根据一个确定的矩形计算,这个确定 ...

  2. 理解CSS中的BFC(块级可视化上下文)[译]

    开篇 一些元素,如float元素,如position为absolute,inline-block,table-cell或table-caption的元素,以及overflow属性不为visible的元 ...

  3. CSS中包含块原理解析

    CSS包含块原理解析 确定CSS中的包含块也确定就是元素的父元素.关键是:看元素是如何定位的.确定包含块很重要,比如设置百分比.另外也可以进行样式的继承等等. 分两个情况: 相对定位和静态定位 静态定 ...

  4. CSS中的视觉格式化模型

    视觉格式化模型 1. 简介 在视觉格式化模型中,文档树中的每个元素都将会根据盒模型产生零到多个盒子.这些盒子的布局由如下因素决定: 盒子的尺寸和类型 定位策略(正常文档流,浮动或者绝对定位) 和文档树 ...

  5. CSS2.1SPEC：视觉格式化模型之包含块

    原汁原味的才是最有味道的,在阅读CSS标准时对这一点的体会更加深刻了,阅读文档后的一大感觉就是很多看上去理所应当的样式表现也都有了对应的支持机制.本文首先从包含块写起,一方面总结标准中相应的阐述,并且 ...

  6. [HTML/CSS]盒子模型，块级元素和行内元素

    目录 概述 盒子模型 块级元素 行内元素 可变元素 总结 概述 在div+css中,了解块级元素和行内元素还是非常有必要的,比如:对行内元素使用width属性就会失效.虽然自己不是做前端的,但是,在项 ...

  7. css中margin重叠和一些相关概念（包含块containing block、块级格式化上下文BFC、不可替换元素 non-replaced element、匿名盒Anonymous boxes ）

    平时在工作中,总是有一些元素之间的边距与设定的边距好像不一致的情况,一直没明白为什么,最近仔细研究了一下,发现里面有学问:垂直元素之间的margin有有互相重叠的情况:新建一个BFC后,会阻止元素与外 ...

  8. 由position属性引申的关于css的进阶讨论（包含块、BFC、margin collapse）

    写这篇文章的起因是源于这篇文章:谈谈面试与面试题 中关于position的讨论,文中一开始就说的这句话: 面试的时候问个css的position属性能刷掉一半的人这是啥情况…… 其实这问题我本来打算的 ...

  9. CSS包含块containing block详解

    “包含块(containing block)”,W3c中一个很重要的概念,今天带大家一起来好好研究下. 初步理解 在 CSS2.1 中,很多框的定位和尺寸的计算,都取决于一个矩形的边界,这个矩形,被称 ...

随机推荐

  1. python5.1文件的读取

    fh1=open(r"C:\222.txt","r")#用open函数读取文件,“r”进行转义,fh1文件句柄data=fh1.read()#把读取的句柄赋值给 ...

  2. 仅需1秒！搞定100万行数据：超强Python数据分析利器

    前言 使用Python进行大数据分析变得越来越流行.这一切都要从NumPy开始,它也是今天我们在推文介绍工具背后支持的模块之一. 2 Vaex Vaex是 一种更快.更安全.总体上更方便的方法,可以使 ...

  3. linux学习笔记之makefile

    首先 make时工程管理器 而makefile则是make唯一的配置文件,当我们需要使用make管理工程时,我们需要建立一个makefile文件 简单点说,makefile是把我们所要编译的c文件结合 ...

  4. .NETCore微服务探寻(三) - 远程过程调用(RPC)

    前言 一直以来对于.NETCore微服务相关的技术栈都处于一个浅尝辄止的了解阶段,在现实工作中也对于微服务也一直没有使用的业务环境,所以一直也没有整合过一个完整的基于.NETCore技术栈的微服务项目 ...

  5. FPN和他的子孙们

    FPN 方框里表示top down里每层有两个卷积操作  PAN:添加一个 bottom up线 NAS-FPN:基于搜索结构的FPN  Fully-conencted FPN:全连接的FPN  Si ...

  6. 【API进阶之路】高考要考口语？我用多模态评测API做了一场10w+刷屏活动

    摘要:闲着没事用多模态评测API做了一个测评英语口语的互动小游戏,居然成了一场10万人参与的刷屏级活动. 上一期故事说到,我成为了公司技术委员会副主席,上任后的第一件事是建立了一个云容器化的研发资料库 ...

  7. 如何有效防止sql注入

    SQL注入攻击是黑客对数据库进行攻击常用的手段之一,随着B/S模式应用开发的发展,使用这种模式编写应用程序的程序员也越来越多.但是由于程序员的水平及经验参差不齐,相当大一部分程序员在编写代码的时候,没 ...

  8. JavaScript 手写 setTimeout 及 同步调用和异步调用

    demo let timeout = (sec, num) => { const now = new Date().getTime() // 获取进入方法时的时间 let flag = true ...

  9. 简单快速搭建钓鱼wifi

    前言 钓鱼wifi是很久的话题了,但是传统的方法可能比较麻烦需要手动配置dhcp,dns,网卡,流量转发,比较麻烦,而且还有根据每次的网络环境需要重新的配置,这里介绍用WIFIpumpkin3工具简单 ...

  10. Spring Boot 教程 - 文件上传下载

    在日常的开发工作中,基本上每个项目都会有各种文件的上传和下载,大多数文件都是excel文件,操作excel的JavaAPI我用的是apache的POI进行操作的,POI我之后会专门讲到.此次我们不讲如 ...