HTML文件里的!Doctype有什么作用？
事情起因于，我发现有<!DOCTYPE html>的网页和没有的，页面展示的header差了2px。调试了css好久的也解决不了。偶然间删除了doctype结果居然对齐了，也就是说它会影响某些CSS。 所以，我仔细研究了一下DOCTYPE 的作用。
DOCTYPE是什么？
DOCTYPE是document type的简写，它并不是 HTML 标签，也没有结束标签，它是一种标记语言的文档类型声明，即告诉浏览器当前 HTML 是用什么版本编写的。DOCTYPE的声明必须是 HTML 文档的第一行，位于html标签之前。大多数Web文档的顶部都有doctype声明，它是在新建一个文档时，由Web创作软件草率处理的众多细节之一。很少人会去注意 doctype ，但在遵循标准的任何Web文档中，它都是一项必需的元素。doctype会影响代码验证，并决定了浏览器最终如何显示你的 Web文档。
DOCTYPE的作用是什么？
DOCTYPE声明中指出阅读程序应该用什么规则来解释文档中的标记。在Web文档的情况下，阅读程序通常是浏览器或者校验器这样的一个程序，规则是W3C所发布的一个文档类型定义 DTD 中包含的规则。制作一个符合标准的网页，DOCTYPE声明是是不可缺少的，它在Web设计中用来说明你用的XHTML或者HTML是什么版本，如果不做DOCTYPE声明或声明不正确的情况下，将有可能导致你的标识与CSS失效，从而令你网页的布局变乱，造成网页在浏览器中不能正常的显示。我们还可以通过W3C提供的验证工具来检查页面的内容是否符合在DOCTYPE中声明的标准。
常见问题
如果不声明doctype会发生什么？如何解决？
声明文档的解析类型(document.compatMode)，避免浏览器的怪异模式。这个属性会被浏览器识别并使用，但是如果你的页面没有DOCTYPE的声明，那么compatMode默认就是BackCompat,
这也就是怪异的开始 -- 浏览器按照自己的方式解析渲染页面，那么，在不同的浏览器就会显示不同的样式。
如果你的页面添加了那么，那么就等同于开启了标准模式，那么浏览器就得老老实实的按照W3C的标准解析渲染页面，这样一来，你的页面在所有的浏览器里显示的就都是一个样子了。
关于 DOCTYPE 的一个小发现：
使用 XHTML 声明时，图片是完美贴合包裹 DIV 元素的,但使用 HTML 5 标准声明时，包裹 DIV 元素底部会被撑开 2～5 个像素不等。
HTML <!DOCTYPE>标签的用法注意事项
1. <!DOCTYPE> 声明没有结束标签。
2.<!DOCTYPE> 声明对大小写不敏感。
3. 请使用 W3C 的验证器来检查您是否编写了有效的 HTML / XHTML 文档！
HTML <!DOCTYPE>标签的浏览器支持
支持的浏览器包括IE，Firefox，Chrome，Safari，Opera等即所有浏览器都支持 <!DOCTYPE> 声明。
腾讯云开发者
