什么是HTML
一种超文本标记语言: HyperText Markup Language
常见误区：HTML 不是一种编程语言，而是一种标记语言
标记语言是一套标记标签
HTML文档的别名web 页面
HTML 使用标记标签来描述网页
HTML 文档包含了HTML 标签及文本内容
入门
新建一个HTML文件（这里采用的软件是HBuilderX）
<!DOCTYPE html> // 声明文档类型为HTML5
<html> // HTML文档的根元素
<head> // 文档的头部，包含元数据
<meta charset="utf-8"> // 设置文档的字符编码为UTF-8，支持多语言字符
<title></title> // 文档的标题，此处为空，应在<title>和</title>之间添加标题文本
</head>
<body> // 文档的主体，包含实际显示的内容
<h1>我的第一个标题</h1> // 一级标题，通常用于页面或章节的主要标题
<p>我的第一个段落。</p> // 段落，用于包含文本内容
</body>
</html>保存并运行，运行效果：
组成
头部：（即head里的部分：<head> 内容 </head>）
可用于添加网页的相关信息，如网页名，CSS样式等 （CSS先做了解）
身体：（即body里的部分：<body> 内容 </body>）
标题：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h1>我是标题 1</h1>
<h2>我是标题 2</h2>
<h3>我是标题 3</h3>
<h4>我是标题 4</h4>
</body>
</html>运行结果：
HTML 标题（Heading）是通过<h1> - <h4> 标签来定义的。并且大小逐渐减小。
段落：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<p>我是一个段落。</p>
<p>我是一个段落。</p>
<p>我是一个段落。</p>
</body>
</html>运行结果：
HTML 段落是通过标签 <p> 来定义的。
链接：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<a href="https://blog.csdn.net/MeyrlNotFound?type=blog"> 引号内是引用的网址</a>
</body>
</html>运行结果：
点击即可跳转到该网址。
HTML 链接是通过标签 <a> 来定义的。
图像：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<img src="我是图片.jpg" width="480" height="480" />
</body>
</html>HTML 图像是通过标签 <img> 来定义的。
注意： 图像的名称和尺寸以属性的形式提供。
图像后缀.jpg要打上，而且运行时图像要与html文件在一个文件夹中。
表格：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<table border="1">
<tr>
<th>Header a</th>
<th>Header b</th>
</tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
</body>
</html>运行结果：
表格由 <table> 标签来定义。每个表格有多行（由 <tr> 标签定义），每行被分割多个单元格（由 <td> 标签定义）。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。表格的表头使用 <th> 标签进行定义。如果不定义边框属性，表格将不显示边框。
使用
<table>标签来定义表格的开始。使用
<tr>标签来定义表格中的行。使用
<th>标签来定义表头单元格。使用
<td>标签来定义表格中的标准单元格。使用
<caption>标签来为表格添加标题。使用
<colgroup>和<col>标签来为表格中的一组列定义属性。使用
<thead>、<tbody>和<tfoot>来分别定义表头、主体和脚注部分。
下面是一个更详细的HTML表格示例：
<table>
<caption>学生成绩表</caption>
<colgroup>
<col style="background-color: #ffdddd;">
<col style="background-color: #ddffdd;">
<col style="background-color: #ddddff;">
</colgroup>
<thead>
<tr>
<th>姓名</th>
<th>数学</th>
<th>语文</th>
</tr>
</thead>
<tbody>
<tr>
<td>张三</td>
<td>95</td>
<td>88</td>
</tr>
<tr>
<td>李四</td>
<td>85</td>
<td>98</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>平均分</td>
<td>90</td>
<td>92</td>
</tr>
</tfoot>
</table>
其他：
段落和換行
- ＜p>：定义一个段落。
- <br>： 插入一个简单的换行符。
<p>这是一个段落。</p>
sp>这是另一个段落。＜br>这是同一段落中的新一行。≤/p>文本格式化标签
- <b> 或 <strong>： 加粗文本（ <strong> 在语义上表示重要性）。
- <i> 或 <em>：斜体文本（<em>在语义上表示强调）。
- <u>：下划线文本(不推荐用于表示强调，因为与链接的下划线可能混淆）。
- <s> 或 <del>： 刪除袋文本（<del> 在语义上表示被刪除的文本）。
- <small>： 小号文本。
- <mark>：高亮文本（通常力黄色背景）。
<p>这是<b>加粗</b>文本。</p>
<p>这是<em>强调</em>文本。</p>
<p>这是<u>下划线</u>文本。</p>
<p>这是<s>删除线</s>文本。</p>
<p>这是<small>小号</small>文本。</p>
<p>这是<mark>高亮</mark>文本。</p>文本对齐
使用CSS 样式来控制对齐，而不是HTML标签。可以在<p>、<div>等标签内使用
style 属性来没置 text-align。
<p style="text-align:left;">左对齐文本。</p>
<p style="text-align:center;">居中文本。</p>
<p style="text-align:right;">右对齐文本。</p>引用和预格式化文本：
<blockquote>：定义长引用。
<q>：定义短引用。
<pre>：预格式化文本，保留空格和换行。
<blockquote>
这是一个长引用的例子。它通常用于表示从其他来源引用的较大段落。
</blockquote>
<p>这是<q>一个短引用</q>的例子。</p>
<pre>
这是预格式化文本。
它会保留所有的空格和换行。
</pre>上标与下标：
<sup> ： 上标文本（常用于表示幂或脚注）。
<sub>：下标文本(常用于表示化学式中的下标）。
<p>这是上标文本：X<sup>2</sup></p>
<p>这是下标文本：H<sub>2</sub>O</p>插入特殊字符：
HTML 提供了ー些安体来表示特殊字符，例如 表示空格， ＆lt;表示小于号
< ，> 表示大于号 > 等。
<p>这是一个包含特殊字符的段落：<div>Hello, World!</div></p>尾部：
以</html>作结，与开头的<html>形成对应。