基础认知
浏览器
浏览器是网页显示、运行的平台，是前端开发的必备利器。常见的五大浏览器是IE、Firefox、Chrome、Safari和Opera。
渲染引擎
渲染引擎又叫做浏览器内核，是浏览器中专门对代码进行解析渲染的部分。IE内核时Trident，Firefox是Gecko，Safari是Webkit，Chrome和Opera是Blink（Webkit）的分支。
渲染引擎不同，导致解析相同代码时的速度、性能、效果也不一样。
Web标准
不同浏览器的渲染引擎不一样，对于相同代码解析的效果会存在差异，Web标准存在的意义就是让不同的浏览器按照相同的标准显示结果，让展示的效果统一。
Web标准的构成分为三方面，如下表所示：
| 语言 | 功能 | |
|---|---|---|
| 结构 | HTML | 页面元素 |
| 表现 | CSS | 页面样式 |
| 行为 | JavaScript | 页面交互 |
HTML标签学习
HTML概念
Hyper Text Markup Language，简称HTML，专门用于网页开发的语言，主要通过HTML标签对网页中的文本、图片、音频、视频等内容进行描述。
HTML页面固定结构
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
注释
<!-- 注释内容 -->
排版标签
标题标签
<h1></h1>到<h6></h6>分别代表一到六级标题。
段落标签
<p>段落内容</p>可以用于分段显示。
换行标签
<br>该标签为单标签，可以让文字强制换行。
水平线标签
<hr>这也是一个单标签，可以在页面中显示一条水平线。
文本格式化标签
| 标签 | 含义 |
|---|---|
| b | 加粗 |
| u | 下划线 |
| i | 倾斜 |
| s | 删除线 |
| strong | 加粗 |
| ins | 下划线 |
| em | 倾斜 |
| del | 删除线 |
后面四个表示的强调语义更强烈。实际项目开发中选择标签的原则：标签语义化。理由：对人而言便于理解，便于记忆；对机器来说有利于机器解析。
媒体标签
图片标签
<img src="" alt="">
单标签，img标签需要展示对应效果，需要借助标签的属性进行设置。
等号前是属性名，等号后面双引号的内容是属性值。属性名="属性值"。
属性名src对应的属性值是图片路径，alt则代表替换文本，是图片加载失败的时候显示alt的文本。title代表鼠标悬停时显示的文本。width和height代表宽度和高度。
音频标签
<audio src=""></audio>
src依然代表路径，controls表示显示播放控件，autoplay表示自动播放，loop表示循环播放。
标签是HTML5的新标签，目前支持三种格式：MP3，Wav以及Ogg。
视频标签
<video src="" controls></video>
src依然代表路径，controls表示显示播放控件，autoplay表示自动播放，并且其再谷歌浏览器中配合muted可以实现静音播放，loop表示循环播放。
标签也是HTML5的新标签，目前支持三种格式：MP4，WebM以及Ogg。
链接标签
<a href="">描述文字</a>
如果需要该标签点击之后指定页面，需要设置href属性，若href设置为#，点击之后回到网页顶部，也可以在开发中用来占位。target设置目标网页的打开形式，其中，_self是默认值，覆盖原网页进行跳转，_blank在新窗口中跳转。
该标签默认文字有下划线，没点击默认显示蓝色，点击之后显示为紫色，清除记录恢复蓝色。
语义化标签
没有语义的布局标签
主要是div和span。
div表示独占一行；span表示一行可以显示多个。
有语义的布局标签
| 标签名 | 语义 |
|---|---|
| header | 网页头部 |
| nav | 网页导航 |
| footer | 网页底部 |
| aside | 网页侧边栏 |
| section | 网页区块 |
| article | 网页文章 |
其他标签构成
标签的结构
分为单标签和双标签。
单标签自成一体，无法包裹内容；而双标签的前半部分叫做开始标签，后半部分叫做结束标签，中间叫做包裹的内容。
标签的关系
嵌套关系和并列关系。
