HTML面经

HTML面经
1. DOCTYPE 的作用是什么？
DOCTYPE是document type(文档类型)的简写,声明位于HTML文档中的第一行，处于标签之前。告知浏览器的解析器用什么文档（哪种HTML或XHTML）标准解析这个文档。DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现
2. 标准模式与兼容模式各有什么区别？
标准模式的排版 和JS运作模式都是以该浏览器支持的最高标准运行。
兼容模式中，页面以宽松的向后兼容的方式显示,模拟老式浏览器的行为以防止站点无法工作。
3.SGML 、 HTML 、XML 和 XHTML 的区别？
GML
是第一代置标语言，使文档能明确将标示和内容分开。
GML主要用来解决不同系统中文档格式不同的问题。

SGML
在 GML 的基础上进行整理，形成了一套非常严谨的文件描述方法。它的组成包括语法定义，DTD(W3C DTD 教程)，文件实例三部分。
SGML是国际上定义电子文档和内容描述的标准。
SGML因太严谨规范达500多页，故而不易学、不易用、难以实现，所以在它的基础上又发展出了其他的更易用的置标语言。

HTML (HyperText Markup Language) / 超文本标记语言
是人们抽取了 SGML的一个微小子集而提取出来的。其早期规范比较松散，但比较易学。

XML (Extensible Markup Language )/ 可扩展标记语言
也是 SGML 的一个子集，但使用比较严格的模式。

XHTML (Extensible Hypertext Markup Language) / 可扩展超文本标记语
它的出现是因为HTML扩充性不好，内容的表现跟不上时代的变化（如无法表示某些化学符号等），以及因为性能的问题，官方逐渐趋于严格的模式，所以使用 XML的严格规则的XHTML成了W3C 计划中 HTML 的替代者。

HTML5
经过一系列修订，到现在说的 HTML 一般指 HTML 4.01；
而现在的 HTML 5则是 HTML 的第五个修订版，其主要的目标是将互联网语义化，以便更好地被人类和机器阅读，并同时提供更好地支持各种媒体的嵌入。
HTML5本身并非技术，而是标准。它所使用的技术早已很成熟，国内通常所说的html5实际上是html与css3及JavaScript和api等的一个组合，大概可以用以下公式说明：HTML5≈HTML+CSS3+JavaScript+API

4.空元素定义
没有内容的HTML元素，比较常见的空元素像img link br meta这种，他们往往没有关闭标签
5.你是如何理解语义化的？
对人：
增强可读性，对开发者更友好，在没有 CSS 的情况下也能较好地呈现网页的内容结构与代码结构，便于团队的开发和维护。

对机器：
有利于 SEO （搜索引擎优化），可以让搜索引擎爬虫更好地获取到更多有效信息，搜索引擎的爬虫依赖于标签来确定上下文和各个关键字的权重，有效提升网页的搜索量。
支持读屏软件，方便其他设备的解析（如屏幕阅读器、盲人阅读器等），利于无障碍阅读，提高可访问性。

头部：header 导航：nav 主体内容：main 标题：h1 ~ h6 段落：p 侧边栏：aside 页脚：footer
6.meta viewport 是做什么的？怎么写?
meta viewport是专门为移动设备下的显示所设计的，为了在移动设备下，网页不需要缩放和滚动条就能查看网页中的所有内容，文字、图片大小合适等，只有检测都在移动设备上使用包含了meta的文档时，这个标签才会起作用。
写法：meta name=“viewport” content=“width=device-width, initial-scale=1.0”

7.页面导入样式时，使用 link 和 @import 有什么区别？
所属范围
@import 是css的语法，只能导入样式
link是html的标签，不仅可以加载样式，还可以定义rel属性
rel="stylesheet"表示调用外部样式表
加载顺序
页面加载的时候，link标签引入的css被同时加载
@import引入的css在页面加载完毕后再被加载
兼容性
@import需要兼容IE5+
link标签，不存在兼容性问题
8. Label 的作用是什么？是怎么用的？
label是表单组件，用于表示某一表单组件的标题；
label便签用可以让用户点击文字区域，自动聚焦到当前项的input框。
input设置id属性，label设置for属性，for属性的属性值为id属性值。for与为设定标题的表单组件的ID值一致
9.请写出至少5个HTML块元素标签
table div p h1~h3 hr ul ol li body html caption
10.请写出至少5个HTML行内元素标签
span input a image em i strong label br sup sub textarea
13.请写出table标签下面会包含哪些标签元素
thead tbody tfoot tr th/td caption
11.H5的新特性你了解哪些？
1.用于绘画canvas 元素。
2.用于媒介回放的 video 和 audio 元素。
3.本地离线存储 localStorage 长期存储数据，浏览器关闭后数据不丢失；
sessionStorage 的数据在浏览器关闭后自动删除。
4.语意化更好的内容元素，比如 article、footer、header、nav、section。
5.表单控件，calendar、date、time、email、url、search。
12.html的核心属性有哪些？
核心属性：id、class、style、title