转:Quirks模式与Standards模式

Quirks Mode中发生了什么?

 Quirks Mode是一种浏览器(像IE,Firefox,Opera)操作模式。从根本上说,怪异模式(也称之为兼容模式)意味着一个相对新的浏览器故意模拟许多在旧浏览器中存在的bug,特别是在IE4和IE5中。

Quirks Mode是由文档类型探查法触发。也就是大家熟知的文档类型切换。这意味着浏览器检查一个HTML文档的开始,看它是否包含一个HTML规范所要求的文档类型声明。

Quirks Mode的目标是使旧页面显示出他们的作者想要的那样。旧页面可能利用旧浏览器已知的特性写成,或者至少是适应旧浏览器。更多关于怪异模式的信息请访问QuirksMode.Org。

Quirks Mode是什么没有权威的规范。毕竟,实质上Quirk Mode是一个故意违反CSS和HTML的规范。然而,因为作者们可能需要一个在Quirk Mode中实际上会发生什么的描述,所以我撰写了这个文档。

如何进入Standards模式?

一般来讲浏览器是通过DTD来判断模式的;浏览器进入Standards模式的DTD有:HTML的strict.dtd和loose.dtd这两个DTD的简单区别是

  • strict去掉了许多表现的标签,有利于结构和表现的分离
  • loose会导致Firefox进入Almost Standards模式,在图片的处理上会有微小的差别

在IE6下,如果在DTD之前有任何字符都将导致其进入quirks模式

Quirks模式与Standards模式的区别

quirks和standards的区别很多都可以归为IE5和IE6的区别

盒模型的高宽包含内补丁和边框
在W3C标准中,如果设置一个元素的宽度和高度,指的是元素内容的宽度和高度,而在Quirks模式下,IE的宽度和高度还包含了padding和border。IE5.5及以下的浏览器即使在Standards模式下,也会有这个问题
可以设置行内元素的高宽
在Standards模式下,给span等行内元素设置wdith和height都不会生效,而在quirks模式下,则会生效
可设置百分比的高度
在standards模式下,一个元素的高度是由其包含的内容来决定的,如果父元素没有设置百分比的高度,子元素设置一个百分比的高度是无效的
用margin:0 auto设置水平居中在IE下会失效
使用margin:0 auto在standards模式下可以使元素水平居中,但在quirks模式下却会失效,quirk模式下的解决办法,用text-align属性:
body{text-align:center};#{content:text-align:left}
设置图片的padding会失效
Table中的字体属性不能继承上层的设置
white-space: pre会失效
许多CSS默认样式将不同
在Standards模式下,给span等行内元素设置wdith和height都不会生效,而在quirks模式下,则会生效
JavaScript中的区别
Quirks mode的Table of measurements

参考

 

原文地址:https://www.cnblogs.com/youxin/p/2649625.html