共计 1003 个字符，预计需要花费 3 分钟才能阅读完成。
<!DOCTYPE>
定义
document type 用来说明所使用的 html 版本
作用
使浏览器获知用哪个版本的 HTML 规范来渲染文档
请始终向 html 文档中添加 doctype 声明，doctype 不存在或形式不正确会导致页面以混杂模式呈现
注意
<!DOCTYPE> 声明必须是 HTML 文档的第一行，位于 <html> 标签之前。
<!DOCTYPE> 声明不是 HTML 标签；它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。
<!DOCTYPE> 声明没有结束标签。
<!DOCTYPE> 声明对大小写不敏感。
<!DOCTYPE html>
是 h5 标准，原先的是一串很长的字符串，现在是这个简洁形式，支持 html5 标准的主流浏览器都认识这个声明。
Doctype 可声明三种 DTD(document type definition)类型，分别表示严格版本、过渡版本以及基于框架的 HTML 文档。
HTML5 不基于 SGML，所以不需要对 DTD 进行引用
没有严格模式与宽松模式的区别，html5 有相对宽松的语法，事实上，已经尽可能大的实现了向后兼容。
HTML4.01 基于 SGML，所以需要引用 DTD。才能告知浏览器文档所使用的文档类型，如下：
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”>
SGML：（Standard Generalized Markup Language 标准通用标记语言）
混杂模式 & 标准模式
标准模式（Standards mode）：
以浏览器支持的最高标准运行
混杂模式（Quirks mode）：
页面以一种比较宽松的向后兼容的方式显示。
混杂模式通常模拟老式浏览器的行为以防止老站点无法工作。
console.log(document.compatMode)// 可观测浏览器处于那种模式
行内元素、块级元素、空元素
行内元素：
a span img input select
块级元素：
div h1 p ul ol li dl dd dt table fieldset form
空元素：
br link meta hr
行内元素、块级元素对比
内容
一般情况下，行内元素只能包含数据和其他行内元素。
而块级元素可以包含行内元素和其他块级元素。这种结构上的包含继承区别可以使块级元素创建比行内元素更”大型“的结构。
格式
默认情况下，行内元素不会以新行开始，而块级元素会新起一行。