Standards模式和Quirks模式有什么区别？
Standards 模式（标准模式）和 Quirks 模式（怪异模式）是浏览器渲染网页的两种不同模式，它们主要影响 HTML 和 CSS 的解释方式。选择哪种模式取决于网页的 DOCTYPE 声明。这两种模式的存在是为了兼容旧的网页，因为早期的浏览器对标准的支持并不一致。
主要区别：
-
盒模型: 这是最显著的区别之一。在 Standards 模式下，盒模型的宽度计算方式是
content width。这意味着元素的width属性只包含内容的宽度，不包括 padding 和 border。而在 Quirks 模式下，盒模型的宽度计算方式是content width + padding + border。这意味着元素的width属性包含了内容、padding 和 border 的宽度。 -
图片尺寸: 在 Quirks 模式下，一些图片的尺寸计算方式可能与 Standards 模式不同，尤其是在没有明确指定尺寸的情况下。
-
行高: Quirks 模式和 Standards 模式下，行高的计算也可能存在差异，尤其是在使用百分比值时。
-
表格单元格的垂直对齐: Quirks 模式下，表格单元格的内容默认垂直居中对齐。而在 Standards 模式下，默认是基线对齐。
-
字体: Quirks 模式下，字体处理可能与 Standards 模式不同，尤其是在继承方面。
-
font-size继承: 在 Quirks 模式中，<font>元素的font-size属性值会以像素为单位继承。而在 Standards 模式中，继承的是计算值（computed value），这可能导致不同的显示效果。 -
CSS 解析: 浏览器在 Quirks 模式下会模拟旧版浏览器的 CSS 解析行为，以兼容旧的网页。
DOCTYPE 的影响:
-
Standards 模式: 通过声明正确的 DOCTYPE，例如
<!DOCTYPE html>，浏览器会切换到 Standards 模式。这是推荐的做法，因为它确保网页按照最新的 HTML 和 CSS 标准进行渲染。 -
Quirks 模式: 如果没有 DOCTYPE 声明，或者使用了过时的 DOCTYPE，例如
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">，浏览器会切换到 Quirks 模式。 -
Almost Standards 模式: 这是一种介于 Standards 模式和 Quirks 模式之间的模式。它触发的方式是使用一些过渡型的 DOCTYPE，例如
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">。它与 Standards 模式非常相似，但仍保留一些 Quirks 模式的行为，例如图片尺寸的计算。
总结:
为了确保网页的跨浏览器兼容性和一致性，强烈建议使用 <!DOCTYPE html> 来启用 Standards 模式。避免使用 Quirks 模式，除非是为了维护非常古老的网页。了解这两种模式的区别可以帮助开发者更好地理解网页的渲染行为，并避免潜在的兼容性问题。
