关于浏览器点染html页面采用的三种文本模式
日期：2014-05-17 浏览次数：20662 次
???? 在开启这个话题前，先看一行代码。
?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
???? 想必做web开发的朋友都很熟悉这段代码，它一般位于html页面的头部，它是指定了 浏览器在解释Html代码时所采用的渲染规范(如html各元素的显示位置及大小等)。
???? 这个渲染规范由w3c给出，然后各浏览器根据这个渲染规范 去解释html代码，最终呈现给大家丰富多彩的页面效果。
?
???? 通常w3c会给出多组Doctype规范，开发人员可自由地选取一个Doctype规范，让浏览器根据这个规范去渲染页面。但在同一个Doctype规范下，不同浏览器也会采用不同的文本模式对html页面进行渲染。
???? 而浏览器采用的文本模式的不同，最终影响到了html页面的显示效果。
?
???? 现在来说说文本模式。文本模式共有 诡异模式 （Quirks?mode ，也有翻译为兼容模式、怪异模式的）、标准模式 （Standards?mode ）和几乎标准模式 （Almost?standards?mode ）三种。
??? 上面我们提到Doctype规范决定了浏览器将会采用哪种文本模式去渲染html页面。如果当我们不指定Doctype时，IE6、IE7会采用诡异模式渲染页面，IE8以标准模式渲染页面(IE9下没测试)，ff11也是以标准模式渲染页面。当我们采用了w3c所提供的某一个Doctype规范时，可参照下面的表格以了解浏览器将会以何种文本模式渲染html页面。
?????? 通过查看上面的表格数据，w3c提供了一个不带DTD规范的Doctype，即<!Doctype html>，IE8以上的IE版本及其他主流浏览器，在这个Doctype下 均会采用标准模式对html页面进行渲染。
?? ?? 由于HTML5不基于 SGML，它不需要在Doctype中引用DTD规范，因此<!Doctype html>被大量使用在了html页面中，让浏览器按照它们应该的方式来运行。
?
????? 如何获取当前浏览器以何种文本模式渲染的html页面呢？ 可通过js获取document.compatMode的值来获取当前浏览器所采用的文本模式，该值一般有两个BackCompat(代表诡异文本模式)、CSS1Compat(代表标准文本模式)。
?
?
?
?
???
?
