1.2.2 HTML中的基础标签
在Web开发的世界里，HTML（HyperText Markup Language，超文本标记语言）是构建网页和Web应用程序的基石。它定义了网页内容的结构，通过一系列的标签（Tags）来告诉浏览器如何显示页面上的文本、图片、链接、表格等内容。在《TypeScript和Vue从入门到精通(一)》这本书中，我们虽然主要聚焦于TypeScript和Vue.js的深入学习，但了解HTML的基础知识对于构建任何Web应用都是至关重要的。本节将详细介绍HTML中一些基础且常用的标签，帮助读者打下坚实的Web开发基础。
1.2.2.1 文档结构标签
任何HTML文档都始于<!DOCTYPE html>声明，它告诉浏览器这是一个HTML5文档。紧接着是<html>标签，它包裹了整个HTML文档的内容。<html>标签内部通常包含两个主要部分：<head>和<body>。
<!DOCTYPE html>：文档类型声明，告诉浏览器文档使用HTML5标准。<html>：HTML文档的根元素，包含整个页面的内容。<head>：包含了文档的元（meta）数据，如字符集定义（<meta charset="UTF-8">）、文档的标题（<title>）、链接到CSS文件（<link>）或JavaScript文件（<script>）等，但不包含可见的页面内容。<body>：包含了网页的所有可见内容，如文本、图片、视频、游戏、可点击的按钮以及可交互的表单等。
1.2.2.2 文本格式化标签
在HTML中，可以通过一系列标签来改变文本的外观，如加粗、斜体、下划线等。
<h1>到<h6>：标题标签，<h1>是最高级别的标题，<h6>是最低级别的。这些标签用于定义HTML文档中的标题或子标题，<h1>通常用于主标题，而<h6>则用于最不重要的子标题。<p>：段落标签，用于定义文本的一个段落。浏览器会在段落前后自动添加一些空白。<b>和<strong>：加粗文本。<b>是简单的加粗，而<strong>表示内容的重要性。<i>和<em>：斜体文本。<i>用于纯粹的样式效果，而<em>表示内容的强调。<u>和<ins>：下划线文本。<u>是简单的下划线，而<ins>表示被插入的文本。<s>和<del>：删除线文本。<s>表示不再准确或不再相关的内容，而<del>表示被删除的文本。
1.2.2.3 链接与图片
在Web上，链接和图片是不可或缺的元素。
<a>：超链接标签，用于创建从一个页面到另一个页面的链接。它可以通过href属性指定链接的目标地址，如<a href="https://www.example.com">访问Example网站</a>。<img>：图片标签，用于在网页中嵌入图片。它通常需要src（图片来源）、alt（替代文本，用于图片无法显示时）等属性，如<img src="image.jpg" alt="描述性文本">。
1.2.2.4 列表标签
列表是展示信息的有序或无序集合，HTML提供了三种列表类型。
- 无序列表：使用
<ul>（unordered list）标签和<li>（list item）标签来创建。列表项前默认带有项目符号（如圆点）。 - 有序列表：使用
<ol>（ordered list）标签和<li>标签来创建。列表项前会带有数字或字母序号。 - 定义列表：使用
<dl>（definition list）标签、<dt>（definition term）标签和<dd>（definition description）标签来创建。通常用于术语及其定义的列表。
1.2.2.5 表格标签
HTML表格用于在网页上显示表格化数据。
<table>：定义表格。<tr>：定义表格中的一行（table row）。<th>：定义表格中的表头单元格（table header），内容默认加粗并居中显示。<td>：定义表格中的标准单元格（table data）。<caption>：定义表格的标题，通常位于表格的上方或下方。
1.2.2.6 表单标签
表单是Web页面上用于收集用户输入的部分，HTML提供了多种表单控件。
<form>：定义表单的容器，可以通过action属性指定表单提交后数据的处理页面，通过method属性指定提交数据的方式（GET或POST）。- 输入控件：如
<input>，根据type属性的不同，可以创建文本框、密码框、单选按钮、复选框、提交按钮等多种输入控件。 <textarea>：多行文本输入控件，允许用户输入任意数量的文本。<select>：下拉选择菜单，与<option>标签结合使用来定义菜单中的选项。<button>：按钮控件，可以定义点击按钮时执行的操作，如提交表单。
1.2.2.7 语义化标签
HTML5引入了许多新的语义化标签，旨在让网页的结构更加清晰，便于搜索引擎理解和索引。
<article>：表示页面上的独立内容区域或一篇完整的文章。<section>：表示文档中的一个区域（或节），通常包含一组内容及其标题。<nav>：表示导航链接的部分。<aside>：表示与页面主要内容稍微独立的内容，如侧边栏。<header>：表示页面或页面内某个区域的头部。<footer>：表示页面或页面内某个区域的底部。
了解并熟练使用这些基础HTML标签，是构建任何Web应用的第一步。在后续学习TypeScript和Vue.js的过程中，你会发现这些HTML知识将是你构建动态、交云Web应用的坚实基础。随着你对这些技术的深入理解，你将能够创建出既美观又功能强大的Web应用程序。
