hasLayout

Layout是 IE 的专有概念,它决定了元素如何对其内容进行定位和尺寸计算,与其他元素的关系和相互作用。HTML的元素中,有些是默认就已经触发了Layout,而有些默认没有触发。当IE的Layout被触发后,我们就说该元素“拥有布局”,使用object.currentStyle.hasLayout可获取到ture值,否则将获取到false,并且Layout的触发是不可逆的。关于Layout的更详细介绍,推荐这篇文章《On having layout》。hasLayout的触发条件如下:

  • display: inline-block
  • height: (除 auto 外任何值)
  • width: (除 auto 外任何值)
  • float: (left 或 right)
  • position: absolute
  • zoom: (除 normal 外任意值)
  • writing-mode: tb-rl

附1:IE7特有的触发Layout的属性

  • min-height: (任意值)
  • min-width: (任意值)
  • max-height: (除 none 外任意值)
  • max-width: (除 none 外任意值)
  • overflow: (除 visible 外任意值,仅用于块级元素)
  • overflow-x: (除 visible 外任意值,仅用于块级元素)
  • overflow-y: (除 visible 外任意值,仅用于块级元素)
  • position: fixed

附2:默认触发Layout的HTML元素

<html>, <body>
<table>, <tr>, <th>, <td>
<img>
<hr>
<input>, <button>, <select>, <textarea>, <fieldset>, <legend>
<iframe>, <embed>, <object>, <applet>
<marquee>

BFC

BFC,块格式化上下文( Block formatting context ),是指初始化块级元素定义的环境。在CSS中,元素定义的环境有两种,一种是块格式化上下文( Block formatting context ),另一种是行内格式化上下文( Inline formatting context )。其中我们使用比较多的是块级可视化上下文,CSS3草案中将之称为“flow root”,但我们仍习惯叫BFC,其的触发条件如下:

  • 浮动元素(float除了none)
  • 绝对定位元素(absolute/fixed)
  • 设置了’display’ 属性为 “inline-block”,”table-cell”, “table-caption” 的元素
  • 设置了overflow 非 “visible”的元素

相关文章:

  • 2021-12-26
  • 2021-11-29
  • 2022-12-23
  • 2021-08-04
  • 2021-10-24
  • 2021-06-25
  • 2021-05-17
  • 2022-12-23
猜你喜欢
  • 2022-12-23
  • 2022-02-10
  • 2022-12-23
  • 2022-12-23
  • 2021-07-19
  • 2021-12-18
相关资源
相似解决方案