浅谈浏览器兼容性模式[按F12便知]
(编辑：jimmy 日期: 2024/11/26 浏览：3 次 )
面试官：请你谈谈标准(Standards)模式、怪异(Quirks)模式、准标准(Almost Standards)模式，当你打开IE9时候会看见，浏览器模式，文档模式，兼容性视图，这些又是什么？
好吧，一点点来：先明白一个词DTD（文档类型定义），也就是你F12后，页面里第一行的一串东西，即doctype声明。
这一串东西就是告诉浏览器你要用何种模式来渲染页面，说白了就是让浏览器用何种标准的CSS进行页面布局。
有三种模式供你选择：
- 标准模式（Standards Mode）
- 准标准模式（Almost Standards Mode）
- 怪癖模式（Quirks Mode）
官方定义：
- 标准模式（Standards Mode）
标准模式中，浏览器尝试给符合标准的文档在规范上的正确处理达到在指定浏览器中的程度。
- 准标准模式（Almost Standards Mode）
它按照传统的做法来实现表格单元格的垂直尺寸而不是严格的遵照CSS2规范，更接近Mozilla的准标准模式而不是Mozilla的标准模式。
- 怪癖模式（Quirks Mode）
怪癖模式中，为了避免“破坏”那些根据在20世纪90年代末流行的实践创作的页面，浏览器违反了现代的Web格式规范。不同的浏览器实现了不同的怪癖行为。IE6、7和8中，怪癖模式有效地冻结在IE5.5 。其他浏览器中，怪癖模式是对准标准模式的少量偏移。
自定义：
- 标准模式（Standards Mode）
官方规定，你跟着照做就行了。
- 准标准模式（Almost Standards Mode）
在设置line-height，某些情况下的height，这两种效果会无法正确执行，其他和标准一样（当前新浏览器已经放弃了此模式）
- 怪癖模式（Quirks Mode）
一种非主流模式，由于当年IE6灰常NB，当时所有的页面都要符合他的渲染标准，但由于标准的出现，大量的页面都无法适应新标准，而IE为了包容这些站点，所以保留了这种模式，也就是不规范的CSS算法，主要体现在盒子模型上。
触发方式：
- 标准模式
复制代码代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <!-- 严格执行 --><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><!-- 兼容XHTML废弃的标签 -->
- 准标准模式
复制代码代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN">
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
- 怪癖模式
第一行不写，或写错DOCTYPE就能触发
- 一统江湖式
复制代码代码如下:
<!DOCTYPE html> <!-- HTML5 -->
下一篇：网站页面切图与CSS注意事项