怪异模式(Quirks mode)和标准模式(strict mode)是浏览器用于解析CSS的两种“模式”。
早期(IE6诞生以前),各浏览器都处于各自比较封闭的发展中, 各自实现CSS机制,不遵循W3C提出的标准。随着WEB的发展,兼容性问题的解决越来越显得迫切,随即,各浏览器厂商发布了遵循W3C标准(遵循各厂商制定的统一标准)工作的浏览器,比如IE6就是其中之一。但是考虑到以前建设的网站并不支持标准模式,所以各浏览器在加入标准模式的同时也保留了怪异模式(即以前那种未按照统一标准工作的模式,也叫混杂模式)。
早期,在标准模式下图片会突然获得奇怪的底部边距,并且无法移除。原因是在标准模式下,<img />标签是行内元素,意思是一些空间将被保留给下行字母字符如g, j, q,而图片并没有下行字符,所以空间是从未使用过,但它仍然必须保留。
解决办法是声明图片为块级元素:img{display:block}
浏览器厂商,尤其是Mozilla,认为这是一个混乱的情况,于是他们引入了“近似标准模式”(Almost Standards Mode,也称为准标准模式),这也是标准模式,只不过它将图片当作块级元素而不是行内元素。
大多数常见的doctypes都触发近似标准模式。目前为止,图片的处理是近似标准模式和真正标准模式最重要的区别。
因此,浏览器的模式可以分为两类:标准模式和混杂模式,其中,标准模式又可更严格的分为近似标准模式和标准模式。DOCTYPE,或者称为 Document Type Declaration(文档类型声明,缩写DTD)。通常情况下,DOCTYPE 位于一个 HTML 文档的最前面的位置,位于根元素 HTML 的起始标签之前。这样一来,在浏览器解析 HTML 文档正文之前就可以确定当前文档的类型,以决定其需要采用的渲染模式(不同的渲染模式会影响到浏览器对于 CSS 代码甚至 JavaScript 脚本的解析)。
选择使用哪种模式需要一个触发器,而 “DOCTYP切换” 则用于此目的。依照标准,任何(X)HTML文档必须有一个DOCTYPE用以告诉其他人这个文档的类型风格。
1. 标准化以前写的网页并没有DOCTYPE声明。因此'没有DOCTYPE'意味着触发怪异模式:既依据旧式的CSS规则渲染网页;
2. 过渡型或框架型HTML/XHTML声明使浏览器进入近似标准模式;
3. Html5的DOCTYPE声明和严格型HTML/XHTML声明则会使浏览器进入标准模式,依据标准的CSS规则渲染网页。
4. 任何新的或未知的DOCTYPE将触发标准模式。
5. 一些页面依据怪异模式而写,但是却包含DOCTYPE。这种情况下各个浏览器依据自己的DOCTYPE规则列表来触发怪异模式。