HTML的全称为超文本标记语言，是一种标记语言。它包括一系列标签．通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字，图形、动画、声音、表格、链接等。超文本是一种组织信息的方式，它通过超级链接方法将文本中的文字、图表与其他信息媒体相关联。这些相互关联的信息媒体可能在同一文本中，也可能是其他文件，或是地理位置相距遥远的某台计算机上的文件。这种组织信息方式将分布在不同位置的信息资源用随机方式进行连接，为人们查找，检索信息提供方便。
入门篇
HTML和Web浏览器一同被创造出来，HTMl是具有特定格式的文本数据，配合浏览器能自动解析并呈现出复杂的页面，HTML是一种标记语言，使用标签来描述页面。
HTML文档，以.html或.htm结尾，我们可以使用记事本来编写HTML，这里推荐使用VScode（直接下载：VSCode-win-x64）。
下面是一个完整的HTML文档：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>第一个HTML文档</title>
</head>
<body>
<h2>Hello, HTML!</h2>
<p>Hello HTML!</p>
</body>
</html>提示：标签不区分大小写。
基本标签
| 标签 | 描述 |
|---|---|
| <!DOCTYPE> | 定义文档类型。 |
| <html> | 定义 HTML 文档。 |
| <head> | 定义关于文档的信息。 |
| <title> | 定义文档的标题。 |
| <body> | 定义文档的主体。 |
| <h1> to <h6> | 定义 HTML 标题。 |
| <p> | 定义段落。 |
| <br> | 定义简单的折行。 |
| <hr> | 定义水平线。 |
| <!–…–> | 定义注释。 |
<!DOCTYPE>标签
<!DOCTYPE> 声明必须是 HTML 文档的第一行，位于 <html> 标签之前。
<!DOCTYPE> 声明不是 HTML 标签；它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。
HTML5中定义的语法是：
<!DOCTYPE html>
提示：请始终向 HTML 文档添加 <!DOCTYPE> 声明，这样浏览器才能获知文档类型。
使用doctype标签定义一个html文档：
<!DOCTYPE html>
<html>
<head>
<title>文档的标题</title>
</head>
<body>
文档的内容......
</body>
</html><html> 标签
此元素可告知浏览器其自身是一个 HTML 文档。
<html> 与 </html> 标签限定了文档的开始点和结束点，在它们之间是文档的头部和主体。正如您所了解的那样，文档的头部由 <head> 标签定义，而主体由 <body> 标签定义。
| 属性 | 值 | 描述 |
|---|---|---|
| manifest | url | 定义一个 URL，在这个 URL 上描述了文档的缓存信息。 |
| xmlns | http://www.w3.org/1999/xhtml | 定义 XML namespace 属性。 |
使用html标签告知浏览器自身是一个HTML文档：
<html>
<head>
<title>我的第一个 HTML 页面</title>
</head>
<body>
<p>body 元素的内容会显示在浏览器中。</p>
<p>title 元素的内容会显示在浏览器的标题栏中。</p>
</body>
</html><head> 标签
<head> 标签用于定义文档的头部，它是所有头部元素的容器。<head> 中的元素可以引用脚本、指示浏览器在哪里找到样式表、提供元信息等等。
文档的头部描述了文档的各种属性和信息，包括文档的标题、在 Web 中的位置以及和其他文档的关系等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。
下面这些标签可用在 head 部分：<base>, <link>, <meta>, <script>, <style>, 以及 <title>。
<title> 定义文档的标题，它是 head 部分中唯一必需的元素。
提示：应该把 <head> 标签放在文档的开始处，紧跟在 <html> 后面，并处于 <body> 标签或 <frameset> 标签之前。
提示：请记住始终为文档规定标题！
语法：
<head></head>
| 属性 | 值 | 描述 |
|---|---|---|
| profile | URL | 一个由空格分隔的 URL 列表，这些 URL 包含着有关页面的元数据信息。 |
文档的头部经常会包含一些 <meta> 标签，用来告诉浏览器关于文档的附加信息。在将来，创作者可能会利用预先定义好的标准文档的元数据配置文件（metadata profile），以便更好地描述它们的文档。profile 属性提供了与当前文档相关联的配置文件的 URL。
配置文件的格式以及浏览器使用它们的方式都还没有进行定义，这个属性主要是为将来的开发而保留的占位符。
一个简单的 HTML 文档，带有最基本的必需的元素：
<html>
<head>
<title>我的第一个 HTML 页面</title>
</head>
<body>
<p>body 元素的内容会显示在浏览器中。</p>
<p>title 元素的内容会显示在浏览器的标题栏中。</p>
</body>
</html><title> 标签
<title> 元素可定义文档的标题。
浏览器会以特殊的方式来使用标题，并且通常把它放置在浏览器窗口的标题栏或状态栏上。同样，当把文档加入用户的链接列表或者收藏夹或书签列表时，标题将成为该文档链接的默认名称。
<title> 标签支持以下标准属性：
| 属性 | 值 | 描述 |
|---|---|---|
| dir | rtl ltr | 规定元素中内容的文本方向。 |
| lang | language_code | 规定元素中内容的语言代码。 |
| xml:lang | language_code | 规定 XHTML 文档中元素内容的语言代码。 |
<title>标签基本实例：
<html>
<head>
<title>我的第一个 HTML 页面</title>
</head>
<body>
<p>body 元素的内容会显示在浏览器中。</p>
<p>title 元素的内容会显示在浏览器的标题栏中。</p>
</body>
</html><body> 标签
body 元素定义文档的主体。
body 元素包含文档的所有内容（比如文本、超链接、图像、表格和列表等等。）
可选的属性
| 属性 | 值 | 描述 |
|---|---|---|
| alink | rgb(x,x,x) #xxxxxx colorname | 不赞成使用。请使用样式取代它。规定文档中活动链接（active link）的的颜色。 |
| background | URL | 不赞成使用。请使用样式取代它。规定文档的背景图像。 |
| bgcolor | rgb(x,x,x) #xxxxxxc olorname | 不赞成使用。请使用样式取代它。规定文档的背景颜色。 |
| link | rgb(x,x,x) #xxxxxx colorname | 不赞成使用。请使用样式取代它。规定文档中未访问链接的默认颜色。 |
| text | rgb(x,x,x) #xxxxxx colorname | 不赞成使用。请使用样式取代它。规定文档中所有文本的颜色。 |
| vlink | rgb(x,x,x) #xxxxxx colorname | 不赞成使用。请使用样式取代它。规定文档中已被访问链接的颜色。 |
body标签基本实例：
<html>
<head>
<title>我的第一个 HTML 页面</title>
</head>
<body>
<p>body 元素的内容会显示在浏览器中。</p>
<p>title 元素的内容会显示在浏览器的标题栏中。</p>
</body>
</html>
<h1> 到 <h6> 标签
<h1> – <h6> 标签可定义标题。<h1> 定义最大的标题。<h6> 定义最小的标题。
由于 h 元素拥有确切的语义，因此请您慎重地选择恰当的标签层级来构建文档的结构。因此，请不要利用标题标签来改变同一行中的字体大小。相反，我们应当使用层叠样式表定义来达到漂亮的显示效果。
一般来说，一个页面有且仅有一个h1标签，否则搜索引擎很难识别该页面想表达的最主要的信息。
可选的属性
| 属性 | 值 | 描述 |
|---|---|---|
| align | left center right justify | 不推荐使用。请使用样式替代它。规定标题中文本的排列。 |
h1-h6标签实例：
<html>
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
<p>请仅仅把标题标签用于标题文本。不要仅仅为了产生粗体文本而使用它们。请使用其它标签或 CSS 代替。</p>
</body>
</html><p> 标签
<p> 标签定义段落。
p 元素会自动在其前后创建一些空白。浏览器会自动添加这些空间，您也可以在样式表中规定。
可选的属性
| 属性 | 值 | 描述 |
|---|---|---|
| align | left right center justify | 不赞成使用。请使用样式取代它。规定段落中文本的对齐方式。 |
以下是p标签实例：
<html>
<body>
<p>这是段落。</p>
<p>这是段落。</p>
<p>这是段落。</p>
<p>段落元素由 p 标签定义。</p>
</body>
</html><br> 标签
<br> 可插入一个简单的换行符。
<br> 标签是空标签（意味着它没有结束标签，因此这是错误的：<br></br>）。在 XHTML 中，把结束标签放在开始标签中，也就是 <br />。
请注意，<br> 标签只是简单地开始新的一行，而当浏览器遇到 <p> 标签时，通常会在相邻的段落之间插入一些垂直的间距。
如果您希望文本流在内联表格或图像的下一行继续输出，请使用 clear 属性，该属性有三个可选的值：left、right 或者 all，每个值都代表一个边界或两边的边界。
以下是一个br标签换行实例：
<html>
<body>
<p>
To break<br />lines<br />in a<br />paragraph,<br />use the br tag.
</p>
</body>
</html><hr> 标签
<hr> 标签在 HTML 页面中创建一条水平线。
水平分隔线（horizontal rule）可以在视觉上将文档分隔成各个部分。
可选的属性
| 属性 | 值 | 描述 |
|---|---|---|
| align | center left right | 不赞成使用。请使用样式取代它。规定 hr 元素的对齐方式。 |
| noshade | noshade | 不赞成使用。请使用样式取代它。规定 hr 元素的颜色呈现为纯色。 |
| size | pixels | 不赞成使用。请使用样式取代它。规定 hr 元素的高度（厚度）。 |
| width | pixels% | 不赞成使用。请使用样式取代它。规定 hr 元素的宽度。 |
以下是一个hr分割线实例：
<html>
<body>
<p>hr 标签定义水平线：</p>
<hr />
<p>这是段落。</p>
<hr />
<p>这是段落。</p>
<hr />
<p>这是段落。</p>
</body>
</html>
<!–…–> 标签
注释标签用于在源代码中插入注释。注释不会显示在浏览器中。
您可使用注释对您的代码进行解释，这样做有助于您在以后的时间对代码的编辑。当您编写了大量代码时尤其有用。
使用注释标签来隐藏浏览器不支持的脚本也是一个好习惯（这样就不会把脚本显示为纯文本）：
注释标签：
<!DOCTYPE html>
<html>
<body>
<!--这是一段注释。注释不会在浏览器中显示。-->
<p>这是一段普通的段落。</p>
</body>
</html>
列表标签
waiting…
本篇完，还有疑问？留下评论吧