跟着该视频学习，记录笔记：【黑马程序员pink老师前端入门教程，零基础必看的h5(html5)+css3+移动端前端视频教程】https://www.bilibili.com/video/BV14J4114768?p=12&vd_source=04ee94ad3f2168d7d5252c857a2bf358
Day2 内容梳理：
目录
HTML 2.网页标签
2.1 基础标签的含义
文档类型声明标签
语种标签
字符集
2.2 语义标签（上）
标题标签
段落标签
换行标签
文本格式化标签
无语义标签
HTML/CSS/JS学习笔记 Day3（HTML--网页标签 下）-CSDN博客
HTML 2.网页标签
2.1 基础标签的含义
在VS Code中新建文件并将后缀改为.html后，在一行打一个英文的感叹号再点击Tab，得到系统默认的网页骨架，如下：
接下来将逐行解释每个标签的作用。
文档类型声明标签<!DOCTYPE>
作用是告诉浏览器该使用哪种HTML版本来显示网页
比如：<!DOCTYPE html>指当前页面采取的是HTML5版本来显示网页
注意：
- 必须写在整个页面的第一行。
- <!DOCTYPE>不是一个HTML标签，它就是文档类型声明标签
语种标签<html lang=” ”>
比如<html lang=”en”>，用途是将当前文档显示的语言定义为英语，
分两类：”en”代表英文网页，”zh-CN”代表中文网页。
不过无论写的是en还是zh-CN，我们都可以在html代码中写各种语言。lang这个属性的作用是帮助浏览器和搜索引擎更好地分辨网页语言，并让用户决定是否翻译网站语言，如下：
字符集<meta charset=” ”>
字符集（Character set）是多个字符的集合，便于计算机能够识别和存储各种文字。
在head标签内，可通过<meta charset=“”>来规定HTML文档应该采用哪种字符编码。
Charset常用的值由UTF-8、G8K、BIG5、GB2312。其中UTF-8也被称为“万国码”，基本包含了全世界所有国家需要用到的字符。
注意只能写成UTF-8，其他格式（比如utf8、UTF8）都可能引起乱码。
2.2 语义标签（上）
语义标签分为：标题标签、段落标签、换行标签
不采用语义标签就会导致所有内容都是同样的格式，不利于阅读，如下图：
标题标签 <h1>到<h6>
HTML提供了6个等级的网页标题，从<h1>到<h6>，按照重要性递减。
它们都是双标签的，比如：
<h1>这里是一级标题</h1>补充一下，修改后记得先保存，再右键单击，点击”open in default browser”即可看到效果：
左侧是没使用标题标签的情况，右侧是使用了之后：
<h1>到<h6>的标题字体会逐渐变小变细，区别可参考下图（内容截取自笔记最上方的视频）：
其中h2标题的“文字加粗一行显”指的是只有被囊括在双标签内的文字才算是标题。比如：
<h2>这是一个标题</h2>123这行代码只会显示“这是一个标题”，而不显示“123”。
段落标签<p></p>
双标签<p></p>用于定义段落，比如：
特点：文本在段落中会根据浏览器窗口的大小自动换行；段落和段落之间有明显空隙。
换行标签<br />
一般在HTML中，段落中的文字遇到浏览器窗口的边缘时才会自动换行，如果希望某段文本强制换行，则需要使用单标签<br/>。br是单词break（打断）的缩写。比如：
补充：可通过文本间隔来区分段落标签和换行标签。段落标签会使段落之间有较大缝隙，而换行标签则不会。
文本格式化标签
是文字以特殊效果呈现，有粗体、斜体、下划线等等。
| 语义 | 标签 | 更推荐的标签（因为语义更强烈） |
| 加粗 | <strong></strong>或者<b></b> | <strong>双标签 |
| 倾斜 | <em></em>或者<i></i> | <em>双标签 |
| 删除线 | <del></del>或者<s></s> | <del>双标签 |
| 下划线 | <ins></ins>或者<u></u> | <ins>双标签 |
使用效果如下：
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body>这是正常文字。<br />这是<strong>加粗</strong>的文字。<br />这是<em>倾斜</em>的文字。<br />这是<del>带删除线</del>的文字。<br />这是<ins>带下划线</ins>的文字。<br />
</body>
</html>
无语义标签 <div>、<span>
<div>和<span>无语义，它们的作用像是盒子，用来装内容。
div是division的缩写，表示分割、分区。而span则是跨度、跨距。
特点：
- <div>双标签用于布局，但是一对<div>会独占一整行，所以可以理解为大盒子。
- <span>双标签也用于布局，而一对对<span>可以显示在同一行，可以理解为小盒子
举个例子：
