`
kongxiantao
  • 浏览: 112903 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

什么是Doctype?什么是标准模式与混杂模式?

阅读更多

原文来自:http://www.heiniuhaha.cn/blog/?p=1331


一、什么是Doctype?

DOCTYPE是Document Type(文档类型)的简写,在页面中,用来指定页面所使用的XHTML(或者HTML)的版本。要想制作符合标准的页面,一个必不可少的关键组成部分就 是DOCTYPE声明。只有确定了一个正确的DOCTYPE,XHTML里的标识和CSS才能正常生效。
以XHTML 1.0为例:
XHTML 1.0中有3种DTD(文档类型定义)声明可以选择:过渡的(Transitional)、严格的(Strict)和框架的(Frameset)。这里分别介绍如下。

1.过渡的
一种要求不很严格的DTD,允许在页面中使用HTML4.01的标识(符合xhtml语法标准)。过渡的DTD的写法如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

2.严格的
一种要求严格的DTD,不允许使用任何表现层的标识和属性,例如<br/>等。严格的DTD的写法如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

3.框架的
一种专门针对框架页面所使用的DTD,当页面中含有框架元素时,就要采用这种DTD。框架的DTD的写法如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

ps:
使用严格的DTD来制作页面,当然是最理想的方式。但是,对于没有深入了解Web标准的网页设计者,比较合适的是使用过渡的DTD。因为这种DTD还允许使用表现层的标识、元素和属性,比较适合大多数网页制作人员。

二、什么是标准模式与混杂模式?

不同文档模式主要影响CSS内容的呈现,尤其是浏览器对盒模型的解析,但在某些情况下也会影响到JavaScript的解释执行。
1、文档模式目前有四种:

混杂模式(quirks mode)
 //让IE的行为与(包含非标准特性的)IE5相同
标准模式(standards mode)
//让IE的行为更接近标准行为
准标准模式(almost standards mode)
//这种模式下的浏览器特性有很多都是符合标准的,不标准的地方主要体现在处理图片间隙的时候(在表格中使用图片时问题最明显)。
超级标准模式:
//IE8引入的一种新的文档模式,超级文档模式可以让IE以其所有版本中最符合标准的方式来解释网页内容。

ps:
总的来看,混杂模式让IE像IE5,标准模式使用IE7的呈现引擎,而超级标准模式则是IE8的默认文档模式。
2、如何触发文档模式:

  • 触发混杂模式:
    如果在文档开始处没有发现文档类型声明,则所有浏览器都会默认开启混杂模式。但采用混杂模式不是什么值得推荐的做法,因为不同浏览器在这种模式下的行为差异非常大,如果不使用某些hack技术,跨浏览器的行为根本就没有一致性可言。
  • 触发标准模式:
    <!-- HTML 4.01 严格型 -->
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"  "http://www.w3.org/TR/html4/strict.dtd"> 
    
    <!-- XHTML 1.0 严格型 -->
    <!DOCTYPE html PUBLIC  "-//W3C//DTD XHTML 1.0 Strict//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  • 触发准标准模式:
    <!-- HTML 4.01 过渡型 -->
    <!DOCTYPE HTML PUBLIC  "-//W3C//DTD HTML 4.01 Transitional//EN"  "http://www.w3.org/TR/html4/loose.dtd"> 
    
    <!-- HTML 4.01 框架集型 -->
    <!DOCTYPE HTML PUBLIC  "-//W3C//DTD HTML 4.01 Frameset//EN"  "http://www.w3.org/TR/html4/frameset.dtd"> 
    
    <!-- XHTML 1.0 过渡型 -->
    <!DOCTYPE html PUBLIC  "-//W3C//DTD XHTML 1.0 Transitional//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    
    <!-- XHTML 1.0 框架集型 -->
    <!DOCTYPE html PUBLIC  "-//W3C//DTD XHTML 1.0 Frameset//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
  • IE8中关闭超级标准模式:
    <meta http-equiv="X-UA-Compatible" content="IE=7" />
    //content属性中IE的值用于指定使用哪个版本的呈现引擎来呈现页面。设计这个值的目的就是为了向后兼容那些专门为老版本的IE设计的站点和页面。
分享到:
评论

相关推荐

    CrystalAngelLee#crystal-interview#Doctype 作用? 严格模式与混杂模式如何区分?它们有何

    ( HTML5 没有严格和混杂之分)区分DTD: Document Type Definition文档包含严格的 DOCTYPE:一般以严格模式呈现包含过渡 D

    Html题目问题已经答案完整版

    2.DOCTYPE声明的作用是什么,严格模式与混杂模式如何区分? &lt;!DOCTYPE&gt;声明位于文档的最前面,处于标签前,告知浏览器的解析器,用声明文档类型规范来解析这个文档。 在严格模式(标准模式)中,浏览器根据规范呈现...

    前端校招面试题精编解析大全.pdf

    严格模式与混杂模式如何区分?(Doctype 声明文档类型,严格模式:不允许出现非法标签,混杂模式:允许出现非法标签) 4. HTML5 新特性有哪些?移除了哪些元素?(新特性:Canvas、Video、Audio、LocalStorage 等;...

    HTML 35道面试题及答案.docx

    本文档总结了 35 道 HTML 面试题及答案,涵盖了 HTML 基础知识、DOCTYPE 的作用、标准模式与混杂模式、HTML5 新特性、浏览器内核、HTML 和 HTML5 的区别等内容。 一、DOCTYPE 的作用 DOCTYPE 是 HTML 文档的声明,...

    DOCTYPE 标签

    DOCTYPE声明位于文档的开头,即`&lt;html&gt;`标签之前,其主要作用是确保浏览器以正确的标准模式解析和渲染页面。 DOCTYPE标签的语法通常如下: ```html &lt;!DOCTYPE html PUBLIC "public_identifier" "URL"&gt; ``` 其中,...

    web前端面试题

    - **严格模式** 和 **混杂模式** 的触发方式不同,通过正确的 Doctype 可以避免进入混杂模式。 - 区分两种模式有助于理解浏览器的渲染行为。 **44. 行内元素有哪些?块级元素有哪些?空(void)元素有那些?** - **...

    HTML DOCTYPE的缩写

    如文档中所述,在尝试“举一反三”时,如果没有正确地遵循DOCTYPE的规则,确实可能会导致页面以“混杂模式”渲染,这是在开发过程中需要注意避免的问题。因此,开发者在学习和使用DOCTYPE时,应当掌握正确的知识,并...

    javascript面试题

    - **混杂模式**:通过错误的 Doctype 或没有 Doctype 触发。 **47、行内元素有哪些?块级元素有哪些?空(void)元素有那些?** - **行内元素**:`&lt;span&gt;`, `&lt;a&gt;`, `&lt;img&gt;`。 - **块级元素**:`&lt;div&gt;`, `&lt;p&gt;`, `&lt;ul&gt;...

    html doctype 作用介绍

    浏览器有两种主要的渲染模式:BackCompat(标准兼容模式未开启,也被称为怪异模式或混杂模式)和CSS1Compat(标准兼容模式已开启,也被称为严格模式)。 - **BackCompat(怪异模式)**:在怪异模式下,浏览器尝试...

    2017年前端面试题

    严格模式下,浏览器按照最高的标准执行,而在混杂模式中,浏览器会模拟旧版本浏览器的行为以保持兼容性。DOCTYPE缺失或格式错误会导致页面以混杂模式渲染。 7. **行内元素与块级元素的区别?** 行内元素(如`...

    2021年最新前端面试题(字节跳动)真题解析.pdf

    DOCTYPE作用及严格模式与混杂模式: 1. DOCTYPE声明是位于文档开头的一个指令,它告诉浏览器使用哪种HTML或XHTML规范来解析文档。&lt;!DOCTYPE&gt;声明位于文档中的最前面,位于标签之前,用以触发浏览器的标准模式渲染...

    前端开发面试题2.pdf

    严格模式与混杂模式? Doctype 声明位于文档中的最前面,处于 &lt;html&gt; 标签之前,告知浏览器的解析器,用什么文档类型规范来解析这个文档。严格模式的排版和 JS 运作模式是以该浏览器支持的最高标准运行。在混杂模式...

    笔试主要涉及某些元素的HTML和CSS的示例值.pdf

    - DOCTYPE声明文档类型,影响浏览器如何解析页面,分为严格模式(标准模式)和混杂模式(Quirks模式)。 - 严格模式遵循W3C标准,而混杂模式模拟旧版浏览器的行为。 - 不同模式下,如盒模型、行内元素尺寸设置、...

    面试宝典之吊打面试官系列

    严格模式与混杂模式的区别? - **答案**: - **Doctype**声明用于告诉浏览器文档类型。 - **严格模式**: 严格按照标准解析文档。 - **混杂模式**: 兼容老旧的HTML文档。 **37. IE双边距BUG** - **问题**: IE的...

    wzq的面试题1

    2. DOCTYPE的作用及严格模式与混杂模式: DOCTYPE声明是HTML文档的开头部分,用来告诉浏览器文档遵循的HTML或XHTML规范。不同的DOCTYPE会导致浏览器进入不同的渲染模式:严格模式(Standards Mode)和混杂模式...

    前端校招面试题精编解析大全(1)1

    3. **严格模式与混杂模式**:严格模式下,浏览器按照W3C标准解析和执行代码,提供最佳的渲染效果和JS执行。混杂模式则是浏览器以兼容老版本HTML的方式解析,模拟老式浏览器的行为,以确保旧网站的正常运行。DOCTYPE...

Global site tag (gtag.js) - Google Analytics