引言
HTML（HyperText Markup Language，超文本标记语言）是构建网页和网站的基础。对于想要学习网页制作的人来说，掌握HTML是第一步。本教程将通过视频的形式，从零开始，逐步讲解HTML的基础知识，帮助您轻松掌握网页制作。
第一部分：HTML简介
1.1 HTML的历史
HTML由蒂姆·伯纳斯-李（Tim Berners-Lee）在1989年发明，是互联网上使用最广泛的标记语言之一。它定义了网页的结构和内容。
1.2 HTML的版本
- HTML 1.0：最初版本，定义了基本的结构元素。
- HTML 4.01：最后一个官方的HTML 4版本，包含了大量元素和属性。
- HTML5：最新的标准，提供了更丰富的功能和更好的兼容性。
1.3 HTML文档结构
一个基本的HTML文档包含以下几个部分：
<!DOCTYPE html>：声明文档类型。<html>：根元素，包含整个文档的内容。<head>：包含元数据，如标题、链接、脚本等。<body>：包含可见的内容，如文本、图片、链接等。
第二部分：HTML基础元素
2.1 文档标题
使用<title>标签定义文档的标题，它将显示在浏览器的标题栏中。
<title>我的第一个网页</title>
2.2 段落
使用<p>标签定义段落。
<p>这是一个段落。</p>
2.3 标题
使用<h1>到<h6>标签定义标题，<h1>是最高级别，<h6>是最低级别。
<h1>一级标题</h1>
<h2>二级标题</h2>
<!-- 以此类推 -->
2.4 换行
使用<br>标签进行换行。
这是一个<br>换行示例。
2.5 链接
使用<a>标签创建链接。
<a href="https://www.example.com">访问example.com</a>
2.6 图片
使用<img>标签插入图片。
<img src="image.jpg" alt="描述">
2.7 列表
- 无序列表：使用
<ul>和<li>标签。 - 有序列表：使用
<ol>和<li>标签。
<ul>
<li>列表项1</li>
<li>列表项2</li>
</ul>
<ol>
<li>列表项1</li>
<li>列表项2</li>
</ol>
第三部分：HTML属性
3.1 属性概述
HTML属性提供额外的信息给元素，如<a>标签的href属性定义链接的目标。
3.2 常用属性
class：为元素添加类，用于CSS样式。id：为元素添加唯一标识符。style：直接在元素上应用CSS样式。
<a href="https://www.example.com" class="link" id="link1" style="color: red;">访问example.com</a>
第四部分：HTML与CSS
4.1 CSS简介
CSS（Cascading Style Sheets，层叠样式表）用于控制HTML文档的样式和布局。
4.2 内联样式
在HTML元素中使用style属性直接定义样式。
<p style="color: blue;">这是蓝色文本。</p>
4.3 内部样式表
在<head>部分使用<style>标签定义样式。
<head>
<style>
p { color: green; }
</style>
</head>
4.4 外部样式表
将CSS代码保存为.css文件，并在HTML中使用<link>标签引入。
<head>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
第五部分：总结与练习
5.1 总结
本教程介绍了HTML的基础知识，包括文档结构、基本元素、属性以及与CSS的结合。通过学习这些内容，您已经具备了制作简单网页的能力。
5.2 练习
- 创建一个简单的HTML页面，包含标题、段落、链接和图片。
- 使用CSS改变页面的样式，如字体、颜色和布局。
- 尝试添加列表和表格，进一步丰富页面内容。
通过不断的练习和学习，您将能够掌握更多高级的HTML和CSS技巧，成为一名优秀的网页开发者。