日期:2014-05-17 浏览次数:20724 次
???? 在开启这个话题前,先看一行代码。
?
<!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(代表标准文本模式)。
?
?
?
?
???
?