热搜:NVER node 开发 php

hasLayout && Block Formatting Contexts_html/css_WEB-ITnose

2024-11-05 14:50:01
hasLayout && Block Formatting Contexts_html/css_WEB-ITnose

转自:http://www.smallni.com/haslayout-block-formatting-contexts/

因为本人脑子不好使,自己打印出了一张hasLayout和Block Formatting Contexts(以下简称BFC)的触发表贴在办公桌上(也可以称作创建了BFC),每天看看就记住了,不知道大家有没有对这2个东西做过深入了解,如果真的做过了解,一些各浏览器部分奇怪的BUG也会迎刃而解。今天,我们一起来剖析下,揭开它们神秘的面纱。

1.hasLayout

‘Layout’ 是 IE 的专有概念,它决定了元素如何对其内容进行定位和尺寸计算,与其他元素的关系和相互作用,以及对应用还有使用者的影响。

  • 概念说明:
  • ‘Layout’ 可以被某些 css property(特性)不可逆的触发,而某些 HTML 元素本身就具有 layout 。
  • ‘Layout’ 在 IE 中可以通过 hasLayout 属性来判断一个元素是否拥有 layout ,如 object.currentStyle.hasLayout 。
  • ‘Layout’ 是 IE 浏览器渲染引擎的一个内部组成部分。在 IE 浏览器中,一个元素要么自己对自身的内容进行组织和计算大小, 要么依赖于包含块来计算尺寸和组织内容。为了协调这两种方式的矛盾,渲染引擎采用了 ‘hasLayout’ 属性,属性值可以为 true 或 false。 当一个元素的 ‘hasLayout’ 属性值为 true 时,我们说这个元素拥有了一个布局(layout),即成功触发hasLayout
  • 触发方式:
  • 默认拥有布局的元素:
    , , , 
    ,
    ,