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. linearLayout 和 relativeLayout的属性区别(转)

    LinearLayout和RelativeLayout 共有属性:java代码中通过btn1关联次控件android:id="@+id/btn1" 控件宽度android:layo ...

  2. 未能加载文件或程序集“System.Web.Mvc, Version=5.2.3.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35”或它的某一个依赖项

    在发布网站时遇到如题错误. 错误消息详细信息:未能加载文件或程序集“System.Web.Mvc, Version=5.2.3.0, Culture=neutral, PublicKeyToken=3 ...

  3. SQL Server on Linux

    https://edu.aliyun.com/course/51/lesson/list?spm=5176.8764728.aliyun-edu-course-tab.2.4YyLGD&pre ...

  4. vuex 基础:教程和说明

    作者注:[2016.11 更新]这篇文章是基于一个非常旧的 vuex api 版本而写的,代码来自于2015年12月.但是,它仍能针对下面几个问题深入探讨: vuex 为什么重要 vuex 如何工作 ...

  5. 在ASP.NET MVC中通过勾选checkbox来更改select的内容

    遇到了这样的一个需求:通过勾选checkbox来更改select的内容. 在没有勾选checkbox之前是这样的: 在勾选checkbox之后是这样的: 想通过ajax异步来实现.所以,从控制器拿到的 ...

  6. quartz 2.0 与1.0功能对比

    日常开发来说,相对于1.0版,2.0版在使用上有以下几点需要注意的变化 变化一 比1.0多引用了C5.dll C5.dll 一个C#和其他CLI语言的泛型集合类..Net2.0及以上才可以使用.简介地 ...

  7. eclipse 大括号 改为C语言风格

    http://lishunli.iteye.com/blog/1051701 一.原Eclipse生成的花括号情形 public class test { public static void mai ...

  8. Linux学习18-gitlab新建项目提交代码

    前言 gitlab前面已经搭建好了,如果我们想用把代码上传到gitlab仓库上的话,先要新建一个项目仓库.然后本地安装git环境,就可以提交了 root用户 gitlab首次在浏览器上打开web页面, ...

  9. springboot redis多数据源设置

    遇到这样一个需求:运营人员在发布内容的时候可以选择性的发布到测试库.开发库和线上库. 项目使用的是spring boot集成redis,实现如下: 1. 引入依赖 <dependency> ...

  10. 盾牌第一至七季/全集The Shield迅雷下载

    英文译名The Shield,第1-7季(2002-2008)FX.本季看点:<盾牌>一部极具争议性的连续剧,打破了传统警匪片套路,刻画了性格复杂的警察,他们在与各种罪案做斗争的同时,也面 ...