1(position:static和relative)

它的包含块由它最近的块级、单元格(table cell)或者行内块(inline-block)祖先元素创建。

2.position:fixed

如果元素是固定定位元素,那么它的包含块是当前可视窗口。

3.position:absolute

总的来说,绝对定位("position: absolute")元素的包含块由离它最近的 'position' 属性为 'absolute'、'relative' 或者 'fixed' 的祖先元素创建。

1)

如果其祖先元素是行内元素,则包含块取决于其祖先元素的 'direction' 特性

一. 如果 'direction' 是 'ltr',包含块的顶、左边是祖先元素生成的第一个框的顶、左内边距边界(padding edges) ,右、下边是祖先元素生成的最后一个框的右、下内边距边界(padding edges)  (记着:第一元素左上,最后元素右下)

二。如果 'direction' 是 'rtl',包含块的顶、右边是祖先元素生成的第一个框的顶、右内边距边界 (padding edges) ,左、下边是祖先元素生成的最后一个框的左、下内边距边界 (padding edges)(记着:第一元素右上,最后元素左下)

如果祖先元素不是行内元素,那么包含块的区域应该是祖先元素的内边距边界

iniital containing block就是   “初始viewport“

The initial containing block cannot be positioned or floated

background属性仅仅作用于content 和padding

The background of the box generated by the root element covers the entire canvas.

direction bidi  http://blog.ieph.net/archives/446  (太技术流了吧~~)

height property

1,height的百分比是相对于containingblock来计算的(这点不用怀疑).

2,对于position不为absolute的元素,如果containingblock没有设置height属性,即height:auto那么这个百分比是相对于auto的,所以还是auto;

3,如果这个元素是absolute的,那么这个元素的containingblock的高度等于元素的高度本身,所以这个absolute的元素的百分比可以根据containingblock来自适应

containing block的更多相关文章

  1. Objective-C中block的底层原理

    先出2个考题: 1. 上面打印的是几,captureNum2 出去作用域后是否被销毁?为什么? 同样类型的题目: 问:打印的数字为多少? 有人会回答:mutArray是captureObject方法的 ...

  2. iOS 键盘添加完成按钮,delegate和block回调

    这个是一个比较初级一点的文章,新人可以看看.当然实现这个需求的时候自己也有一点收获,记下来吧. 前两天产品要求在工程的所有数字键盘弹出时,上面带一个小帽子,上面安装一个“完成”按钮,这个完成按钮也没有 ...

  3. python中IndentationError: expected an indented block错误的解决方法

    IndentationError: expected an indented block 翻译为IndentationError:预期的缩进块 解决方法:有冒号的下一行要缩进,该缩进就缩进

  4. JDBC Tutorials: Commit or Rollback transaction in finally block

    http://skeletoncoder.blogspot.com/2006/10/jdbc-tutorials-commit-or-rollback.html JDBC Tutorials: Com ...

  5. 嵌入式&iOS:回调函数(C)与block(OC)传 参/函数 对比

    C的回调函数: callBack.h 1).声明一个doSomeThingCount函数,参数为一个(无返回值,1个int参数的)函数. void DSTCount(void(*CallBack)(i ...

  6. 嵌入式&iOS:回调函数(C)与block(OC)回调对比

    学了OC的block,再写C的回调函数有点别扭,对比下区别,回忆记录下. C的回调函数: callBack.h 1).定义一个回调函数的参数数量.类型. typedef void (*CallBack ...

  7. Block解析(iOS)

    1. 操作系统中的栈和堆 我们先来看看一个由C/C++/OBJC编译的程序占用内存分布的结构: 栈区(stack):由系统自动分配,一般存放函数参数值.局部变量的值等.由编译器自动创建与释放.其操作方 ...

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

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

  9. 用block做事件回调来简化代码,提高开发效率

       我们在自定义view的时候,通常要考虑view的封装复用,所以如何把view的事件回调给Controller就是个需要好好考虑的问题, 一般来说,可选的方式主要有target-action和de ...

  10. 关于多个block问题

    在某个添加文本的页面中,leftbarbutton是删除(直接将数组中的这个string删除),rightbarbutton是完成,分别对应两个block,完成的block是一开始写的,写到了view ...

随机推荐

  1. mate-desktop安装在其他目录时一些配置信息

    1.mate-desktop安装在其他目录时一些配置信息 2.BIN目录下添加相应的mate-session_gtk2/3 3.首先配置如下环境变量 #!/bin/sh if [[ "${E ...

  2. Python Day1

    一.安装python windows 1.下载安装包 https://www.python.org/downloads/ 2.安装 默认安装到C盘下 3.配置环境变量 右键计算机属性---高级系统设置 ...

  3. elastichq 离线安装

    plugin install file:///home/hadoop/xxxx.zip 奇怪的是,这样安装成功后访问host:port:9200/_plugin/hq/ 仍然会报错,找不到一些js函数 ...

  4. html5中新增非主体结构元素

    1.header元素 定义HTML文档的页眉,是一种具有引导和导航作用的结构元素 <header> <h1>header元素</h1> <nav> &l ...

  5. pathinfo()、dirname()、basename()获得文件的路径,名称等信息说明

    在PHP中,若想通过函数获得一个文件的路径.名称,或者是扩展名等,是非常容易的一件事.可以使用dirname().basename().pathinfo()等多种途径获得相应的信息. 假设现在有一个图 ...

  6. Shell入门教程:命令替换 $() 和 ``

    所谓命令替换,是把命令执行后的标准输出放入变量中.这是一个十分有威力的功能.例如说, 想查看工作目录中所有的文件名,可执行ls命令,但如何把这些文件名存入变量中,供往后的程序代码再利用呢? 使用命令替 ...

  7. C和指针 第三章 变量的储存类型 auto、static、register以及static关键词

    变量的储存类型决定标量何时创建,何时销毁以及他的值保持多久.有三个地方可以储存变量: 普通内存static 运行时堆栈auto 硬件寄存器register 变量的缺省储存类型取决于它的声明位置: 静态 ...

  8. HDU 5686 斐波那契数列、Java求大数

    原题:http://acm.hdu.edu.cn/showproblem.php?pid=5686 当我们要求f[n]时,可以考虑为前n-1个1的情况有加了一个1. 此时有两种情况:当不适用第n个1进 ...

  9. 垂直居中display:table;

    父级元素 display:table: 子元素 display:table-cell:vertical-align:middle:

  10. python __call__ 内置函数的使用

    对象通过提供__call__(slef, [,*args [,**kwargs]])方法可以模拟函数的行为, 如果一个对象x提供了该方法,就可以像函数一样使用它,也就是说x(arg1, arg2... ...