1. stack order 发生在BFC计算好了之后。

2.一个一个的BFC里面,不同的block 里面的stack context 会根据 stack order的顺序,进行堆叠。呈现互相遮盖的效果。

例如:

<body>
<style>
div{ border: 1px solid green;}
</style>
<div style="float: left">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>
<div style="float: right;">bbbbbbbbbbbbbbbbbbbbbbbbbbi
<div style="position:relative; border:1px solid red; width:100px;height:100px;margin-top:-30px;left:20px;background-color:green"> </div> </div> </body>

  

效果如上图所示, 第一个div, 和第二个div都是一个独立的BFC, 各种进行计算之后,在进行stack oder 的堆叠。

自己理解BFC 和 stack context , stack order的更多相关文章

  1. structs2 对ActionContext valueStack stack context 的理解 图片实例

    structs2 对ActionContext valueStack stack context 的理解 ActionConext : The ActionContext is the context ...

  2. Java 集合深入理解(13):Stack 栈

    点击查看 Java 集合框架深入理解 系列, - ( ゜- ゜)つロ 乾杯~ 今天心情不错,再来一篇 Stack ! 数据结构中的 栈 数据结构中,栈是一种线性数据结构,遵从 LIFO(后进先出)的操 ...

  3. Struts2的Stack Context和ValueStack

    1.提到Struts2的传值功能时,经常会见到Stack Context和ValueStack等概念,那么它们到底是什么,有什么作用呢. ValueStack(值栈):Struts2将OGNL上下文设 ...

  4. struts2.1.6教程四_2、ActionContext 、ValueStack 、Stack Context

    ActionContext 一次Action调用都会创建一个ActionContext 调用:ActionContext context = ActionContext.getContext() Va ...

  5. 27.OGNL与ValueStack(VS)-获取Stack Context中的信息

    转自:https://wenku.baidu.com/view/84fa86ae360cba1aa911da02.html 我们知道,除了可以从值栈中获取信息,还可以从Stack Context中获取 ...

  6. [知识库:python-tornado]异步调用中的上下文控制Tornado stack context

    异步调用中的上下文控制Tornado stack context https://www.zouyesheng.com/context-in-async-env.html 这篇文章真心不错, 非常透彻 ...

  7. Struts2(六.用标签显示用户列表及Value Stack和Stack Context)

    一.用Struts2标签显示用户列表 原理: 在struts中可以通过在action中将所有用户的信息存入到某个范围中,然后转向userlist.jsp,进行访问 原则: 在jsp网页上,尽量不要出现 ...

  8. 对于BFC(block format context)理解

    目录 前言 Box: CSS布局的基本单位&盒模型 什么是BFC?(Block formatting contexts) 元素与盒 正常流 块级与行内级 产生垂直外边距合并的必备条件 前言 什 ...

  9. 全面理解BFC

    BFC 已经是一个耳听熟闻的词语了,网上有许多关于 BFC 的文章,介绍了如何触发 BFC 以及 BFC 的一些用处(如清浮动,防止 margin 重叠等).虽然我知道如何利用 BFC 解决这些问题, ...

随机推荐

  1. Android MIME类型结构

    Android MIME类型的结构 MIMW类型标准:http://tools.ietf/html/rfc2046根据MIME类型规范,MIME类型包含两部分:类型和子类型.下面是一些流行的MIME类 ...

  2. HTML解析利器HtmlAgilityPack

    一个.NET下的HTML解析类库HtmlAgilityPack.HtmlAgilityPack是一个支持用XPath来解析HTML的类库,在花了一点时间学习了解HtmlAgilityPack的API和 ...

  3. Serilog中的Jobject/Jtoken对象序列化的问题

    今天使用Serilog打印object对象的时候,发现Jtoken对象输出成 [[[]] 这种形式了,本来以为是传入参数的问题,确认了几遍后发现确实是Serilog输出的问题.github上也有人提出 ...

  4. OpenOCD Debug Adapter Configuration

    Correctly installing OpenOCD includes making your operating system give OpenOCD access to debug adap ...

  5. 虫趣:BAD POOL CALLER (par1: 0x20)

    [作者:张佩] [原文:http://www.yiiyee.cn/Blog/0x19-1/] 内核在管理内存的时候,为了提高内存使用效率,对于小片内存的申请(小于一个PAGE大小),都是通过内存池来操 ...

  6. mysql 阿里内核人员

    丁奇 http://dinglin.javaeye.com/ 鸣嵩 @曹伟-鸣嵩 (新浪微博) 彭立勋 http://www.penglixun.com/ 皓庭 http://wqtn22.iteye ...

  7. linux后台开发核心技术

    3. 常用STL的使用 3.1. string (1)string类的实现(使用strlen.strcpy.strcat.strcmp等,注意判NULL). (2)C++字符串和C字符串的转换:dat ...

  8. VS2008 LINK : fatal error LNK1104: cannot open file 'atls.lib'错误解决方案

    用VS 2008编写ATL的64位应用程序时,提示链接错误:VS2008 LINK : fatal error LNK1104: cannot open file 'atls.lib' 问题原因 VS ...

  9. C#编程(六十五)----------表达式树

    表达式树 以前没听过表达式树,只听过表达式,而且听过Lambda表达式,首先介绍一下.NET里表达式树的核心概念:讲代码作为数据,他将一些代码表示为一个对象树,树中的每个节点本身都是一个表达式,不同的 ...

  10. C#编程(四十)----------运算符重载

    运算符重载 所谓的运算符重载是指允许用户使用用户定义的类型编写表达式的能力. 例如,通常需要编写类似与以下内容的代码,入江两个数字相加,很明显,sum是两个数字之和. int i=5,j=4; int ...