自己理解BFC 和 stack context , stack order
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的更多相关文章
- structs2 对ActionContext valueStack stack context 的理解 图片实例
structs2 对ActionContext valueStack stack context 的理解 ActionConext : The ActionContext is the context ...
- Java 集合深入理解(13):Stack 栈
点击查看 Java 集合框架深入理解 系列, - ( ゜- ゜)つロ 乾杯~ 今天心情不错,再来一篇 Stack ! 数据结构中的 栈 数据结构中,栈是一种线性数据结构,遵从 LIFO(后进先出)的操 ...
- Struts2的Stack Context和ValueStack
1.提到Struts2的传值功能时,经常会见到Stack Context和ValueStack等概念,那么它们到底是什么,有什么作用呢. ValueStack(值栈):Struts2将OGNL上下文设 ...
- struts2.1.6教程四_2、ActionContext 、ValueStack 、Stack Context
ActionContext 一次Action调用都会创建一个ActionContext 调用:ActionContext context = ActionContext.getContext() Va ...
- 27.OGNL与ValueStack(VS)-获取Stack Context中的信息
转自:https://wenku.baidu.com/view/84fa86ae360cba1aa911da02.html 我们知道,除了可以从值栈中获取信息,还可以从Stack Context中获取 ...
- [知识库:python-tornado]异步调用中的上下文控制Tornado stack context
异步调用中的上下文控制Tornado stack context https://www.zouyesheng.com/context-in-async-env.html 这篇文章真心不错, 非常透彻 ...
- Struts2(六.用标签显示用户列表及Value Stack和Stack Context)
一.用Struts2标签显示用户列表 原理: 在struts中可以通过在action中将所有用户的信息存入到某个范围中,然后转向userlist.jsp,进行访问 原则: 在jsp网页上,尽量不要出现 ...
- 对于BFC(block format context)理解
目录 前言 Box: CSS布局的基本单位&盒模型 什么是BFC?(Block formatting contexts) 元素与盒 正常流 块级与行内级 产生垂直外边距合并的必备条件 前言 什 ...
- 全面理解BFC
BFC 已经是一个耳听熟闻的词语了,网上有许多关于 BFC 的文章,介绍了如何触发 BFC 以及 BFC 的一些用处(如清浮动,防止 margin 重叠等).虽然我知道如何利用 BFC 解决这些问题, ...
随机推荐
- centos ssh终端下高亮显示git分支名
#set git branch green=$'\e[1;32m' magenta=$'\e[1;35m' normal_colours=$'\e[m' function find_git_branc ...
- HDU 4778 Gems Fight! (2013杭州赛区1009题,状态压缩,博弈)
Gems Fight! Time Limit: 20000/10000 MS (Java/Others) Memory Limit: 327680/327680 K (Java/Others)T ...
- CRC32 of Ether FCS with STM32
Everyone knows that STM32F1xx, STM32F2xx, STM32F4xx have a hardware unit with a polynomial CRC32 0x0 ...
- bitnami下mysql配置-包含phpMyAdmin配置
mysql开启远程访问: 默认情况下mysql的绑定ip是bind-address=127.0.0.1 找到my.cnf bitnami@linux:~$ sudo find / -name my.c ...
- Magent搭建Memcached集群
原文地址:http://ultrasql.blog.51cto.com/9591438/1636374 Memcached集群介绍 由于Memcached服务器与服务器之间没有任何通讯,并且不进行任何 ...
- Visual Studio 2012 调试程序加载缓慢,提示正在下载符号
当在Visual Studio 2012中调试程序的时候,整个过程加载缓慢,并且有类似"正在下载符号......"的提示. 这是因为Visual Studio在调试的时候,默认从M ...
- Linux学习12-CentOS设置多个tomcat开机自启动
前言 一台服务器上有多个tomcat环境,重启服务器后,每次需要手动一个个启动服务,非常麻烦,于是可以设置tomcat开机自启动. tomcat开机自启动非常慢,可以修改jvm下配置解决tomcat开 ...
- JS --- trim() 函数
trim()是一个很适用的方法,作用是去除字符串两边的空白,但是js本身并未提供这个方法,下面介绍js使用trim()的方法. 1.通过原型创建字符串的trim() //去除字符串两边的空白 Stri ...
- BZOJ 3172 [Tjoi2013]单词 AC自己主动机(fail树)
题意:链接 方法:AC自己主动机与fail树性质 解析:复习AC自己主动机的第一道题?(真正的第一题明明是又一次写了遍hdu2222! ) 这题说实话第一眼看上去就是个sb题,仅仅要建出来自己主动机. ...
- Android让手机主动亮屏的代码
我们在做电子阅读器的时候可能会要求屏幕保持常亮,不希望它熄灭.它的原理也是利用系统服务,来操纵底层设备. 一.系统服务——PowerManager PowerManager.java就是管理我们电源方 ...