摘要：标签用于表示代码块。而所有行的单元格都是表格的主要内容，因此都在标签中。引入表格结构标签，是为了更好的区分出各个单元格的含义。
本篇文章已授权微信公众号 dasu_Android（大苏）独家发布
本系列文章内容全部梳理自以下四个来源：
作为一个前端小白，入门跟着这四个来源学习，感谢作者的分享，在其基础上，通过自己的理解，梳理出的知识点，或许有遗漏，或许有些理解是错误的，如有发现，欢迎指点下。
本文接着来学习 HTML 的基本标签，下面是我自己对标签进行的划分，《HTML权威指南》中将标签类别划分成了很多种，比如：内容分组，文档分节，表单七七八八等等。
但我按照自己个人的理解习惯，对总的标签划分成三类：修饰文档结构的标签、修饰文本内容标签、容器类标签。
修饰文档结构的标签大多用于表示一份标准、完整的HTML文档的一些标签，以及可放于
内的一些标签。修饰文本内容标签，大意是说，这些标签是直接用于标记文本内容，赋予文本内容某些语义行为，比如 赋予超链接语义， 赋予了一级标题语义等等。这个类别有些类似于 Android 中表示某个 View 的标签，通俗来讲，这些标签可直接使用在文本内容上了。
容器类标签，并不是真正意义上的容器，而是说，这类标签主要的作用是用来包含其他标签的，但并不是说，只能用来包含其他标签，也可直接对文本内容标记。如
我自己个人将其常用的标签划分成三大类，当然不是很准确，书中划分得更细，但结合 Android 中一些共性的概念，我个人觉得划分成这三类后，我较容易理解各个标签用途：
首先来看份 HTML 的大体上的基本结构：
所以，这些标签用途基本就是用于构建一份基本的 HTML 文档结构，下面看看具体介绍：
准确的说， 并不是 HTML 标签，它是声明 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。
在 HTML 4.01 中， 声明引用 DTD，因为 HTML 4.01 基于 SGML。DTD 规定了标记语言的规则，这样浏览器才能正确地呈现内容。
HTML5 不基于 SGML，所以不需要引用 DTD。
如 H5中用法：
HTML 4 中用法：
每一份 HTML 文档内容的根节点，表示文档内容的开始
文档内容包括两部分：头部声明
和文本内容HTML 文档的头部声明，用于声明该文档的一些属性，以及一些元数据，
内部的内容是用于给浏览器看的，并不是用于给用户看的，浏览器通过 信息，知晓这份文档引用了哪些外部资源文件，使用的哪些属性。可在
中使用的标签并不多：
Title
元数据标签，可用于声明文档所使用的一些元数据，用途蛮多，如下：
标签用于指定 HTML 文档使用了哪些外部资源文件，可以是外部的 CSS 文件，或者网页图标，或者说明文档等等，如下：
--外部CSS
-网页图标
--预先加载page2.html文件
…标签的作用是引导用户从一张页面链接到另一张页面，互联网说到底就是一张张网页通过超链接 互相关联起来的。
所以，只要不是单个页面，只要页面支持跳转，那么 HTML 文档中就肯定有 标签的存在，用于指定下个页面的跳转。
百度
首页
标题5以上是 标签的三种用法，指定绝对路径的链接，指定相对路径的链接，指定文档内的链接。
也就是说， 标签既可以用于指定页面间的跳转关联，也可以指定页面内的跳转。
另外新页面的打开方式也支持多种形式配置，如：
百度通过 target 属性来声明新页面的打开方式，target可以取值如下：
| target | 含义 |
|---|---|
| _blank | 在新页面或标签页中打开文档 |
| _parent | 在父窗框组（frameset）中打开文档 |
| _self | 在当前窗口中打开文档（默认行为） |
| _top | 在顶层窗口打开文档 |
| 在指定窗框中打开文档 |
换行标签
:表示将后续内容转移到新行上
两者都是换行，前者是强制换行，后者是建议在这里换行，但什么时候换行，由浏览器根据当前窗口大小决定，后者通常用于指定单词的换行。
I am dasu, and i am coding.
I am ...
标签用于表示段落，标签围起来的文本内容表示一个段落。
因为浏览器会忽略所有的空格、缩进、换行，最多只会解析成一个空格，所以，即使文本内容的段落结构很好，但经由浏览器解析出来后的文本内容全部都挤到一堆。
因此，
段落标签还是很有必要的。
可以用此来标记哪些文本内容作为一个段落。
用法见上例。
& 标签用于保留源文档中的格式。
标签用于表示代码块。由于浏览器会合并空白字符，忽略掉换行，导致如果文档中含有代码块时显示不符合开发工具下的代码格式风格。
此时，可以借助
标签和一起使用，来阻止浏览器合并空白字符，达到保留代码格式的目的。
- 用法
protected final void setMeasuredDimension(int measuredWidth, int measuredHeight) { boolean optical = isLayoutModeOptical(this); if (optical != isLayoutModeOptical(mParent)) { Insets insets = getOpticalInsets(); int opticalWidth = insets.left + insets.right; int opticalHeight = insets.top + insets.bottom; measuredWidth += optical ? opticalWidth : -opticalWidth; measuredHeight += optical ? opticalHeight : -opticalHeight; } setMeasuredDimensionRaw(measuredWidth, measuredHeight); }
&
标签用于表示有序列表，
- 标签用于表示列表中的每一项。
- 用法
既然是有序列表项，那么序号的起始以及样式是支持通过属性设定的，如下：
通过 start 属性设置起始的编号，通过 type 属性设置编号的样式，可设置的 type 样式如下 :
如果要实现编号是非连续的，那么可以借助
- 标签的 value 属性实现 ：
注：每个 ol 列表项都是独立存在，编号默认都从 0 开始，如果想实现不同列表项的编号连贯，或者想以跨度 2 或其他数递增，那么只用标签属性实现局限很多。这时，可考虑通过 CSS 的 ::before 选择器实现，具体实现后续再说。
&
标签用于表示无序列表，
- 标签表示列表里的每一项.
- 用法
因为是无序列表，所以用法比起有序列表
简单很多，无需使用任何属性，直接用无序标签
包含一系列子项
- 即可。
至于，每一项前的样式，可通过 CSS 样式，通过 list-style-type 属性实现，以上样式对应的 CSS：
ul { list-style-type: disc}
~
标题标签，对应一级到六级标题。
至于每个标题具体字号样式如何，取决于各个浏览器或者网站。
表格标签，但貌似现在不常用了。
HTML 文档做一个表格挺复杂的，涉及的标签很多，如 ,
, 等等。但根节点总是
，一份表格无外乎就是各种单元格组成，而单元格标签为
，另外，浏览器解析表格文本时，是以行为单位来构建表格，并不是列，所以每个单元格都需要指定位于哪一行中，行标签为 。而所有行的单元格都是表格的主要内容，因此都在 标签中。以上是表格的最基本要素，因此一张最简单的表格，至少需要
，，
， 时，会将 省略，但这并不是说就可以不用 标签，而是很多浏览器会自动将 填补上，所以如果有省略 的场景下，使用 css 选择器时得稍微注意一下。三种标签。 有时候，写表格标签时，如果没有其他表头 部分，或者表脚
& & 由于浏览器是以行为单位构建表格，所以一个表格有多少行就是通过
标签来控制，哪些单元格属于哪一行，就放在那一行的 标签中。 虽然说表格都是由一个个的单元格组成，但单元格之间还可以继续划分含义，有些单元格是表示内容，而有些单元格则是表示属性值，或者说列头或行头。
通常来说，这些标题类型的表格都是在第一行或第一列的单元格：
这是一个很常见的二维表格，通过
和 来将表格的单元格含义区分开。 ：标签用于表示单元格的表头 ：标签用于表格单元格的内容 既然是单元格，那么就会存在合并单元格的现象，通俗的讲也就是有些表格的大小并不是只占据一格，而是有可能多行多列。此时，可通过属性来实现：
属性 含义 colspan 单位数值，如1表示占据1列 rowspan 单位数值，如2表示占据2行
- & &
类似于 HTML 文档有一些专门用于表明文档结构的标签，表格同样有一些用于指示表格结构的标签。引入表格结构标签，是为了更好的区分出各个单元格的含义。
比如，
标签用来表示表头类型的单元格，但不管是第一行的表头，还是第一列的表头，用的都是 ，那如果还想继续划分这个表头是属于第一行或者第一列时该怎么做呢？ 所以，引入了一些结构性标签有便于对表格各个单元格更加具体的细分，以满足各种复杂场景。
: 是表格的根节点
: 用来标记表格的标题行
: 用来标记组成脚的行。不用 ，表格最终效果也一样，但用了 之后，如果 CSS 想分别作用第一行，或者第一列，这时就可以很容易的通过 thread th 以及 tbody th 来达到目的了。
所以，结合表格结构性标签的使用，可以让表格的结构更加明确。
表格除了一张表格内容外，通常还会需要有表格的标题，此时用
标签来标记。
- 完整示例
工作记录表 日期 姓名 记录 2018-07-24 suxq 单元格 2018-07-25 单元格