1. 什么是DOCTYPE?

  • DOCTYPE是document type的缩写,它并不是html标签,也没有结束标签,它是标记语言的文档类型声明,即告诉浏览器当前HTML是用什么版本编写的。
  • 注意:DOCTYPE的声明必须是在html文档的第一行,在html头标签之前。

2.DOCTYPE的作用

  • 声明文档的解析类型(document.compatModel),避免浏览器的怪异模式。
  • document.compatModel

BackCompat:怪异模式,浏览器使用自己的怪异模式解析渲染页面。

CSS1Compat:标准模式,浏览器使用W3C的标准解析渲染页面。

  • 这个属性会被浏览器识别并使用,但是如果你的页面中没有DOCTYPE的声明,那么compatModel默认是BackCompat,浏览器按照自己的方式解析渲染页面,那么不同的浏览器就会显示不同的样式。
  • 如果页面添加DOCTYPE,那么就等同于开启了标准模式,那么浏览器就会按照W3C的标准去渲染页面。

3.DOCTYPE取值

  • html5:

<!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">

  • XHTML 1.0 Strict:

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

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

  • XHTML 1.0 Transitional:

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

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

  • XHTML 1.0 Frameset:

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

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

  • XHTML 1.1:

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

HTML的DOCTYPE是什么意思相关推荐

  1. 缺少HTML Doctype造成的样式问题

    很简单的一个登陆界面: 代码: <html> <head><style type="text/css">form span {display: ...

  2. 网页制作知识:XHTML 和 DOCTYPE 切换

    为 Web页指定 DOCTYPE 会影响浏览器呈现页的方式.Internet Explorer.Mozilla Firefox 和 Opera 全都支持一种名为"DOCTYPE 切换&quo ...

  3. html标准模式与混杂模式,关于Doctype、严格模式与混杂模式

    &lt现行程项些或创容的近在绑思目都者于手内近;!Doctype> 文档声明,位于文档中的最前面的位置,处于标签之前.此标签告知浏览器文档使用哪种HTML或XHTML朋说事础发开和数目间 ...

  4. Doctype作用? 严格模式与混杂模式如何区分?它们有何意义

    前端面试题(3) 打卡: 2021-4-27 HTML Doctype 作用? 严格模式与混杂模式如何区分?它们有何 意义? Doctype作用 (1)位于文档最前面,处于标签之前.告诉浏览器用什么文 ...

  5. 令人郁闷的 DOCTYPE

    最近在尝试一些基于 web standard 的开发.碰到了 DOCTYPE 的问题. 翻阅了 w3c 的这个列表网页:http://www.w3.org/QA/2002/04/valid-dtd-l ...

  6. DOCTYPE声明的几种类型

    DOCTYPE声明的几种类型 DOCTYPE 声明决定着浏览器怎么去解析和渲染当前页面,所以对于页面来说是很重要的. HTML5时代,统一用 <!DOCTYPE html> 这样简单的方式 ...

  7. HTML !DOCTYPE 标签

    实例 <!DOCTYPE html> <html> <head> <title>文档的标题</title> </head>< ...

  8. Doctype文档类型学习小结

    Doctype历史学 随手打开一个HTML页面的源码的顶部,我们将看到诸如:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//E ...

  9. Doctype? 严格模式与混杂模式-如何触发这两种模式,区分它们有何意义?

    严格模式与混杂模式--如何触发这两种模式,区分它们有何意义. 在标准模式中,浏览器根据规范呈现页面: 在混杂模式中,页面以一种比较宽松的向后兼容的方式显示. 浏览器根据DOCTYPE是否存在以及使用的 ...

  10. DOCTYPE是什么鬼?文档模式又是什么鬼?

    !DOCTYPE !DOCTYPE是什么: 在所有 HTML 文档中规定 DOCTYPE 是非常重要的,这样浏览器就能了解预期的文档类型, 告诉浏览器要通过哪一种规范(文档类型定义 DTD)解析文档( ...

最新文章

  1. 12Boostrap响应式布局
  2. 10道海量数据处理的面试题
  3. new,delete和malloc,free以及allocatorT
  4. 四种数据持久化方式(上) :属性列表与归档解档
  5. 高级会计师资格考试成绩合格证在全国范围内几年有效
  6. 32 | 答疑(四):阻塞、非阻塞 I/O 与同步、异步 I/O 的区别和联系
  7. mysql info commit_mysql show processlist 发现大量的commit
  8. 容器编排技术 -- Kubernetes kubectl create clusterrole 命令详解
  9. JS常用的设计模式(2)——简单工厂模式
  10. php学习笔记---php调试和开发工具整理
  11. 完美解决Chrome主页老是被毒霸网址大全篡改
  12. 完美解决VMware安装后没有VMnet1和VMnet8的问题
  13. Mysql5.7 的错误日志中最常见的note级别日志解释
  14. 懒人神器,IDEA插件之EasyCode,自动生成CRUD代码
  15. 小马智行获准在北京开启无人化出行服务商业化试点;华为成为Sisvel Wi-Fi 6专利池创始成员 | 美通企业日报...
  16. QMS-云质-质量管理-海克斯康为什么不断收购质量管理软件(QMS)?
  17. Ratione aspernatur nam dolorem vitae quia.Fumer comme créer passer ailleurs jouer lumière.
  18. CODING 携手 Thoughtworks 助力老百姓大药房打造”自治、自决、自动”的敏捷文化
  19. python 操作键盘,鼠标 。我这个是自动企业微信加好友的,源码可以修改成别的。挺好使!
  20. 电磁兼容滤波知识大全

热门文章

  1. 计算机中重命名的英文单词,重命名是什么意思
  2. IDEA 如何新建Source Folder
  3. lintcode 168. 吹气球 动态规划
  4. 计算机填充表格,表格自动填充 这几种你也会?
  5. IDEA2021+Tomcat8+Servlet加载别人的项目时无web application导致无法进行Tomcat部署及实现Servlet程序的解决办法
  6. SHELL命令 -- 查看显卡型号
  7. 在Android软按键中添加Menu键。
  8. Meltdown攻击
  9. Word多级列表不显示和奇数页显示章节标题问题
  10. 吐血整理的大数据学习资源大全