怪异模式和标准模式

来源

在很久以前的网络上，页面通常有两种版本：为网景（Netscape）的 Navigator 准备的版本以及为微软（Microsoft）的 Internet Explorer 准备的版本。当 W3C 创立网络标准后，为了不破坏当时既有的网站，浏览器不能直接起用这些标准。因此，浏览器采用了两种模式，用以把能符合新规范的网站和老旧网站区分开。

目前浏览器的排版引擎有三种模式：怪异模式（Quirks mode）、接近标准模式（Almost standards mode）、以及标准模式（Standards mode）。在怪异模式下，排版会模拟 Navigator 4 与 Internet Explorer 5 的非标准行为。为了支持在网络标准被广泛采用前，就已经建好的网站，这么做是必要的。在标准模式下，行为即（但愿如此）由 HTML 与 CSS 的规范描述的行为。在接近标准模式下，只有少数的怪异行为被实现。

怪异模式有哪些怪异的行为？

主要分为 5 类

• Miscellaneous & Style
• Block and Inline layout
• Tables
• Frames
• HTML Parser

具体可以看 mdn 上的详细信息 https://developer.mozilla.org/en-US/docs/Mozilla/Mozilla_quirks_mode_behavior

几乎标准模式有哪些怪异的行为？

MDN 上的说法： inline boxes that have no non-whitespace text as a child and have no border, padding, or margin

• do not influence the size of the line box (that is, their line-height is ignored)
• do not get a height (e.g., for their background) larger than that of their descendants, even if their font size is larger (if they have no descendents, they are zero-height positioned at their baseline)

粗浅的翻译一下。 内联盒子没有非空白文本作为子项，没有边框，填充或边距。

• 无法影响 line 盒子的大小（也就是说，忽略它们的行高）
• 即使它们的字体大小较大（如果它们没有后代，它们在他们基线处），也不会使其高度（例如，对于它们的背景）大于它们的后代的高度