深入理解DOCTYPE的作用

        现在的代码编辑器越来越人性化,各种插件、快捷键都能够帮助我们快速生成代码。比如:使用vscode编辑器在html文档中输入!再按tab键就能快速生成一个完整的html结构。如图所示

深入理解DOCTYPE的作用_第1张图片

        今天我们要说的不是代码编辑器,我们将目光移到文档的顶部,会发现顶部有一个声明,很多人不知道这个这个声明有何作用,甚至还想把它给删除。

1.DOCTYPE的作用

        DOCTYPE是document type (文档类型) 的缩写。声明位于文档的最前面,处于标签之前,它不是html标签。主要作用是告诉浏览器的解析器使用哪种HTML规范或者XHTML规范来解析页面。

2.删除会发生什么?

        在W3C标准出来之前,不同的浏览器对页面渲染有不同的标准,产生了一定的差异。这种渲染方式叫做混杂模式。在W3C标准出来之后,浏览器对页面的渲染有了统一的标准,这种渲染方式叫做标准模式。不存在或者形式不正确会导致HTML或XHTML文档以混杂模式呈现,就是把如何渲染html页面的权利交给了浏览器,有多少种浏览器就有多少种展示方式。因此要提高浏览器兼容性就必须重视

3.严格模式和混杂模式

         严格模式和混杂模式都是浏览器的呈现模式,浏览器究竟使用混杂模式还是严格模式呈现页面与网页中的DTD(文件类型定义)有关,DTD里面包含了文档的规则。比如:loose.dtd

严格模式:又称标准模式,是指浏览器按照W3C标准来解析代码,呈现页面

混杂模式:又称为怪异模式或者兼容模式,是指浏览器按照自己的方式来解析代码,使用一种比较宽松的向后兼容的方式来显示页面。

4.常见的DOCTYPE声明

HTML5

HTML 4.01 Strict
该 DTD 包含所有 HTML 元素和属性,但不包括展示性的和弃用的元素(比如 font)。不允许框架集(Framesets)。

HTML 4.01 Transitional
该 DTD 包含所有 HTML 元素和属性,包括展示性的和弃用的元素(比如 font)。不允许框架集(Framesets)。

HTML 4.01 Frameset

 

该 DTD 等同于 HTML 4.01 Transitional,但允许框架集内容。

XHTML 1.0 Strict
该 DTD 包含所有 HTML 元素和属性,但不包括展示性的和弃用的元素(比如 font)。不允许框架集(Framesets)。必须以格式正确的 XML 来编写标记。

 

XHTML 1.0 Transitional
该 DTD 包含所有 HTML 元素和属性,包括展示性的和弃用的元素(比如 font)。不允许框架集(Framesets)。必须以格式正确的 XML 来编写标记。

 

XHTML 1.0 Frameset

 

该 DTD 等同于 XHTML 1.0 Transitional,但允许框架集内容。

XHTML 1.1

该 DTD 等同于 XHTML 1.0 Strict,但允许添加模型(例如提供对东亚语系的 ruby 支持)。

 

文章每周持续更新,可以微信搜索「 前端大集锦 」第一时间阅读,回复【视频】【书籍】领取200G视频资料和30本PDF书籍资料

 

你可能感兴趣的:(HTML)