浏览器 怪异模式（Quirks Mode） 与 标准模式（Standards Mode）

怪异模式，浏览器使用自己的方式解析渲染页面，在不同的浏览器就会显示不同的样式。
标准模式，浏览器使用W3C的标准解析渲染页面。

通过 document.compatMode 的值可以知道当前用的是什么模式。
BackCompat：怪异模式
CSS1Compat：标准模式

IE 6 for Windows/mac, Mozilla, Safari和Opera 都实现了这两种模式，但是IE 6以下版本永远定在了怪异模式。
没有指定dtd将会开启浏览器的怪异模式，这种说法是错的！正确的说法应该是没有定义doctype才会开启怪异模式。

在标准化之前写的页面是没有doctype的，因此没有doctype的页面是在怪异模式下渲染的。
反过来说，如果web开发人员加入的doctype，说明他知道他所要做的事情，大部分的doctype会开启标准模式，页面也会按照标准来渲染。
任何新的或者未知的doctype都会开启标准模式，即只要doctype标签存在就足以开启标准模式了。参考：http://www.quirksmode.org/css/quirksmode.html#link2
每个浏览器都有自己的方式来激活怪异模式。参考：http://hsivonen.iki.fi/doctype/

<!DOCTYPE> 声明必须是 HTML 文档的第一行，位于 <html> 标签之前。
<!DOCTYPE> 声明不是 HTML 标签；它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。
在 HTML 4.01 中，<!DOCTYPE> 声明引用 DTD，因为 HTML 4.01 基于 SGML。DTD 规定了标记语言的规则，这样浏览器才能正确地呈现内容。
HTML5 不基于 SGML，所以不需要引用 DTD。

常用的 DOCTYPE 声明：

HTML 5
<!DOCTYPE html>

HTML 4.01 Strict
该 DTD 包含所有 HTML 元素和属性，但不包括展示性的和弃用的元素（比如 font）。不允许框架集（Framesets）。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

HTML 4.01 Transitional
该 DTD 包含所有 HTML 元素和属性，包括展示性的和弃用的元素（比如 font）。不允许框架集（Framesets）。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

HTML 4.01 Frameset
该 DTD 等同于 HTML 4.01 Transitional，但允许框架集内容。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

浏览器 怪异模式（Quirks Mode） 与 标准模式（Standards Mode）的更多相关文章

  1. DOCTYPE与浏览器模式详解（标准模式&混杂模式）

    关于渲染模式: 在多年以前(IE6诞生以前),各浏览器都处于各自比较封闭的发展中(基本没有兼容性可谈).随着WEB的发展,兼容性问题的解决越来 越显得迫切,随即,各浏览器厂商发布了按照标准模式(遵循各 ...

  2. HTML文档类型DTD与浏览器怪异模式

    虽然在兼容IE6时候经常会注意到两个模式的区别,但是系统的理解起来,还没有认真总结过.看了一些网上的资料.结合自己的理解汇总了一下,放在这里备忘并分享给大家. 浏览器从服务端获取网页后会根据文档的DO ...

  3. Doctype作用？标准模式与兼容模式各有什么区别?

    Doctype作用?标准模式与兼容模式各有什么区别? DOCTYPE是document type(文档类型)的简写,用来告诉浏览器的解析器使用哪种HTML或XHTML规范解析页面.DOCTYPE不存在 ...

  4. HTML学习笔记——DOCTYPE和DTD，标准模式和兼容模式

    主要涉及知识点: HTML与XHTML HTML与XHTML的区别 DOCTYPE与DTD的概念 DTD的分类以及DOCTYPE的声明方式 标准模式(Standard Mode)和兼容模式(Quirc ...

  5. DOCTYPE的作用以及标准模式和兼容模式的区别

    <!doctype>声明必须处于HTML文档的头部,在<html>标签之前,告知浏览器的解析器用什么文档标准解析这个文档.DOCTYPE不存在或格式不正确会导致文档以兼容模式呈 ...

  6. 浏览器Quirksmode(怪异模式)与标准模式

    由于历史的原因,各个浏览器在对页面的渲染上存在差异,甚至同一浏览器在不同版本中,对页面的渲染也不同.在W3C标准出台以前,浏览器在对页面的渲染上没有统一规范,产生了差异(Quirks mode或者称为 ...

  7. 浏览器标准模式与怪异模式-CSS1Compat and BackCompat

    由于历史的原因,各个浏览器在对页面的渲染上存在差异,甚至同一浏览器在不同版本中,对页面的渲染也不同.在W3C标准出台以前,浏览器在对页面的渲染上没有统一规范,产生了差异(Quirks mode或者称为 ...

  8. 标准模式 怪异模式 盒模型 doctype

    在页面顶部设置 doctype是为了统一标准 浏览器有标准模式和怪异模式 而这两种模式最大区别就是 盒模型的解析不同 ============================== 图片摘自网络 === ...

  9. 【HTML&CSS】 第二章：标准模式下的页面与怪异模式下的页面区别

    盒模型 前面提到,盒模型(box mode)是浏览器 Quirks Mode 和 Standards Mode 的主要区别. 描述 对于“盒模型”一词并没有明确的文档定义,它是开发人员描述 CSS 中 ...

随机推荐

  1. 无法创建链接服务器 "TEST" 的 OLE DB 访问接口 "OraOLEDB.Oracle" 的实例

    在使用SQLserver建立远程服务连接Oracle的时候出现先下面错误 出现这个错误,我找到最常见的两个原因 1.注册表 <1>按下WIN+R,打开“运行”窗口,输入“regedit”, ...

  2. Antelope 和Barracuda区别

    Antelope是innodb-base的文件格式, Barracude是innodb-plugin后引入的文件格式,同时Barracude也支持Antelope文件格式.两者区别在于: 文件格式 支 ...

  3. c/c++常用代码--清空目录

    #pragma once #include <io.h>#include <stdio.h>#include <string>#include <direct ...

  4. mysql left( right ) join使用on 与where 筛选的差异

    有这样的一个问题mysql查询使用mysql中left(right)join筛选条件在on与where查询出的数据是否有差异. 可能只看着两个关键字看不出任何的问题.那我们使用实际的例子来说到底有没有 ...

  5. 使用IE10登录,URL出现SessionId的解决办法

    问题:用户登入之后,URL会出现一长串字符,类似SessionId,把这一长串字符删除之后重新进入页面,页面又会自动地跳转到登录页面,所以,应该是Session没记住用户已经登录的信息. 网站环境: ...

  6. 11.1Daily Scrum

    人员 任务分配完成情况 明天任务分配 王皓南 主网页的框架搭建,任务编号760 研究代码,学习相应语言,讨论设计思路 申开亮 学习数据库的操作,任务编号761 研究代码,学习相应语言,讨论设计思路 王 ...

  7. Ubuntu实用快捷键

    ALT + TAB: 切换程序窗口Win+w: 显示所有的工作空间,可轻松进行切换 ===== Terminal终端 ===== CTRL + ALT + T: 打开终端 TAB: 自动补全命令或文件 ...

  8. 一个有趣的 SQL 查询(查询7天连续登陆)

    一个有趣的 SQL 查询 一个朋友有这样一个SQL查询需求: 有一个登录表(tmp_test),包含用户ID(uid)和登录时间(login_time).表结构如下: . row ********** ...

  9. angular入门系列教程3

    主题: 本篇主要目的就是继续完善home页,增加tab导航的三个页index index1 index2 效果图: 细节: 初始化的JS就是咱们的home.js,仔细来看. angular的route ...

  10. text-align:-moz-center与text-align:-webkit-center区别与用法

    最近发现各浏览器的不兼容,关于text-align:center这个很多浏览器不兼容. 1.测试发现:text-align:center在IE下是管用的. 2.text-align:-moz-cent ...