学习目标：
能够理解HTML的基本语法和标签的关系；能够使用排版标签实现网页中标题、段落等效果；能够使用相对路径选择不同目录下的文件；能够使用媒体标签在网页中显示图片、播放音频和视频；能够使用链接标签实现页面跳转功能；能够使用列表标签实现网页中列表结构的搭建；能够使用表格标签及属性实现网页中表格结构的搭建；能够使用表单标签及属性实现表单类网页结构搭建；能够认识常见布局标签的显示特点；能够使用字符实体在网页中显示空格、大于号和小于号
一、基础认知
认识网页：网页是由文字、图片、音频、视频、超链接组成。我们看到的网页背后本质上都是前端程序员写的代码，而前端的代码是通过浏览器转化（解析和渲染）成用户看到的网页。
五大浏览器：浏览器是网页显示、运行的平台，是前端开发的必备利器。常见的五大浏览器有IE浏览器、火狐浏览器(Firefox)、谷歌浏览器(Chrome)、Safari浏览器、欧朋浏览器（Opera），浏览器内核是浏览器中专门对代码进行解析渲染的部分，浏览器出品公司不同，内在的渲染引擎也是不同的，导致解析相同代码的速度、性能、效果也不同。其中，谷歌浏览器的渲染引擎速度快、性能高、效果好，所以更吸引用户的喜爱（推荐）。
Web标准：由于不同浏览器的渲染引擎不同，对于相同代码解析的效果会存在差异，如果用户想看一个网页，结果用不同浏览器打开效果不同，用户体验极差，而Web标准就是让不同浏览器按照相同的标准显示结果，让展示的效果统一。
Web标准中分为3个构成：结构、表现和行为
HTML（Hyper Text Markup Language）中文译为：超文本标记语言。专门用于网页开发的语言，主要通过HTML标签对网页中的文本、图片、音频和视频等内容进行描述。网页中的固定结构是要通过特定的HTML标签进行描述的。其中，html标签表示网页的整体、head标签表示网页的头部，body标签表示网页的身体、title标签表示网页的标题。
Vscode开发工具的基本快捷键：
快速生成标签：英文+tab、保存文件：ctrl+s、快速查看网页效果：ait+b、快速生成标签：！+tab、快速复制整行：ctrl+c、快速粘贴一整行：ctrl+v、快速删除（剪切）一整行：ctrl+x、注释的快捷键：ctrl+/
HTML标签的结构：常见的标签由两部分组成，称之为双标签，前部分叫开始标签，后部分叫结束标签，两部分之间包裹内容，少数标签由一部分组成，称之为单标签，自成一体，无法包裹内容，标签的关系有兄弟关系和父子关系
二、HTML标签及语法
2.1排版标签
h1-h6标签： 表示1-6级标签，重要程度依次递减
p标签：表示段落，独占一行且段落之间存在间隔
br标签：表示换行，单标签，让文字强制换行
hr标签：表示主体的分割转换，单标签，在页面中显示一条水平线
2.2文本格式标签
strong标签：加粗
ins标签：下划线
em标签：倾斜
del标签：删除线
2.3媒体标签
img标签：表示在网页中显示图片
audio标签：表示在页面中插入音频
video标签：表示在页面中插入视频
2.4链接标签
a标签：表示点击之后，从一个页面跳转到另一个页面
2.5列表标签
ul>li标签 :在网页中表示一组无顺序之分的列表
ol>li标签：在网页中表示一组有顺序之分的列表
dl>dt/dd标签：在网页底部导航中通常会使用自定义列表来实现
2.6表格标签
table>tr>td:在网页中以行+列的单元格的方式整齐展示相关的数据
2.7表单标签
input标签：在网页中显示收集用户信息的表单效果，如登录页、注册页
button标签：在网页中显示用户点击的按钮
select标签：在网页中提供多个选择项的下拉菜单表单控件
textarea标签：在网页中提供可输入多行文本的表单控件
label标签：常用于绑定内容与表单标签的关系
2.8语义化标签
2.9字符实体
总结与思考：
HTML的学习偏向于海滩边的捡贝壳，知道什么样的贝壳应该放在哪里，有什么特点，不需要死记硬背，只需要在用的时候能查询到相关的贝壳，并且根据贝壳的特性能够合理使用和维护贝壳即可。
