HTML（HyperText Markup Language）是构建网页的基础语言。以下是全面的 HTML 知识点：
一、HTML 基础概念
-
定义：HTML 是一种用于描述网页结构的标记语言，通过各种标签来定义网页的内容和布局。
-
版本历史：从 HTML 的早期版本发展到现在的 HTML5，功能不断增强，支持更多的多媒体和交互特性。
二、HTML 文档结构
<!DOCTYPE html>声明：用于告诉浏览器文档类型是 HTML5。<html>标签：整个 HTML 文档的根元素。<head>部分：<title>标签：定义网页的标题，显示在浏览器标签栏上。<meta>标签：提供关于文档的元数据，如字符编码、视口设置、搜索引擎优化信息等。<link>标签：用于链接外部样式表、图标等资源。<script>标签：可以包含 JavaScript 代码或链接外部脚本文件。
<body>部分：包含网页的可见内容。
三、HTML 标签分类
- 标题标签（
<h1>-<h6>）：用于定义不同级别的标题。 - 段落标签（
<p>）：定义段落文本。 - 文本格式标签：
<strong>和<b>：用于加粗文本。<em>和<i>：用于斜体文本。<u>：用于添加下划线。<sup>和<sub>：用于上标和下标。<del>和<ins>：用于删除线和下划线表示插入内容。
- 列表标签：
- 无序列表（
<ul>）和有序列表（<ol>），分别使用<li>标签定义列表项。 - 定义列表（
<dl>）、定义术语（<dt>）和定义描述（<dd>）用于创建术语和描述的列表。
- 无序列表（
- 链接标签（
<a>）：用于创建超链接，属性href指定链接目标。 - 图像标签（
<img>）：用于在网页中插入图像，属性src指定图像路径，alt提供替代文本。 - 表格标签：
<table>：定义表格。<tr>：定义表格行。<th>：定义表头单元格。<td>：定义表格数据单元格。
- 表单标签：
<form>：创建表单，可包含各种输入元素。<input>：用于输入文本、密码、复选框、单选按钮等。<textarea>：用于输入多行文本。<select>和<option>：用于创建下拉列表。<button>：创建按钮。
- 语义化标签（HTML5 新增）：
<header>：定义文档或章节的头部。<nav>：定义导航链接部分。<section>：定义文档中的节。<article>：定义独立的内容块，如文章、博客帖子等。<aside>：定义与页面主要内容相关的侧边栏内容。<footer>：定义文档或章节的底部。
四、HTML 属性
- 通用属性：
id：为元素提供唯一的标识符，可用于在 CSS 和 JavaScript 中定位元素。class：为元素指定一个或多个类名，用于样式化和脚本操作。style：用于直接为元素应用内联 CSS 样式。title：为元素提供提示信息，当鼠标悬停在元素上时显示。
- 特定元素属性：不同的 HTML 元素有特定的属性，如
<img>的src、alt、width、height，<a>的href、target等。
五、HTML 多媒体
- 音频（
<audio>标签）：用于在网页中播放音频文件。 - 视频（
<video>标签）：用于在网页中播放视频文件。
六、HTML 表单
- 表单元素类型：
- 文本输入框（
<input type="text">）。 - 密码输入框（
<input type="password">）。 - 复选框（
<input type="checkbox">）。 - 单选按钮（
<input type="radio">）。 - 提交按钮（
<input type="submit">）。 - 重置按钮（
<input type="reset">）。 - 文件上传（
<input type="file">）。
- 文本输入框（
- 表单属性：
action：指定表单提交的目标 URL。method：指定表单提交的方法，如GET或POST。enctype：指定表单数据的编码类型，用于文件上传等情况。
七、HTML5 新特性
- 本地存储（
localStorage和sessionStorage）：用于在浏览器中存储数据。 - 拖放（
draggable属性和相关事件）：允许元素被拖动和放置。 - 画布（
<canvas>标签）：用于使用 JavaScript 绘制图形。 - 地理定位（
geolocationAPI）：获取用户的地理位置信息。 - Web Workers：在后台运行 JavaScript 代码，不影响页面的性能。
- 响应式设计：使用媒体查询和弹性布局实现适应不同设备的网页设计。
八、HTML 最佳实践
- 语义化标记：使用语义化标签提高网页的可访问性和可维护性。
- 结构清晰：保持 HTML 结构清晰，易于理解和维护。
- 代码规范：遵循 HTML 代码规范，包括缩进、标签闭合等。
- 可访问性：确保网页对所有用户都可访问，包括使用适当的替代文本、标题等。
- 性能优化：优化 HTML 代码以提高页面加载速度，如减少不必要的标签、压缩图像等。