1.<!DOCTYPE>是啥
DOCTYPE也就是 document type ，文档类型。
<!DOCTYPE>并不是一个html标签，它被声明在html文档的第一行，用来告诉web浏览器，我们写的这个html文件基于那个html版本，从而浏览器根据不同版本的规则来编写。
<!DOCTYPE>必须在文档第一行来声明。如果没有声明，或者声明错误，则浏览器会以怪异模式/兼容模式来解析，呈现出的效果会差。
2.<!DOCTYPE>怎么用
在HTML4和HTML5中，声明方式不同。
在HTML4.01中有三种声明方式，
HTML 4.01 Strict
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
HTML 4.01 Transitional
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
HTML 4.01 Frameset
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
在 HTML5 中只有一种声明方式
<!DOCTYPE html>
为什么有这种区别，通过观察我们可以看到，在 Html 4.01 中，文档声明最后都引用了.dtd文件，dtd 是 document type defination 的简写。dtd这个文档中标明了文档编写的规则，这样浏览器才可以正确呈现内容。
H5没有引用这个文件。这是因为，Html 4.01 基于SGML，需要引用dtd， HTML 5 不基于SGML，所以不需要引用。
3.其他
a)标准模式(严格模式，standard mode)和兼容模式(怪异模式，qurik mode)
标准模式：排版和js运作模式都是以浏览器当前支持的最高标准来运行。
兼容模式：页面以宽松的向后兼容的方式来呈现页面，能显示什么就显示什么。
判断是什么模式？
console.log(window.top.document.compatMode);
//BackCompat 怪异模式
//CSS1Compat 标准模式
标准模式和兼容模式有哪些区别？
1.width
在标准模式中，width是元素的内容宽度；
在兼容模式中，width是元素的实际宽度;
2.兼容模式下 margin:0 auto 不会居中
3.兼容模式下可以给行内元素设置宽高，标准模式不可以。
b)SGML是什么
请参考：https://wiki.mbalib.com/wiki/SGML
网友评论