一、文本格式化标签——双标签
注：编译于
<标签名>文字| 效果说明 | 标签名1 | 标签名2 | 备注 |
| 文本加粗 | b | strong | 两标签效果相同，后者在语义上更重要 |
| 下划线 | u | ins | 两标签效果相同，后者在语义上更重要 |
| 文本倾斜 | i | em | 两标签效果相同，后者在语义上更重要 |
| 删除线 | s | del | 两标签效果相同，后者在语义上更重要 |
一般情况下，英文单词所表示的标签与单独字母所表示的标签相比，展示效果上并没有什么区别，只是在语义上英文单词标签要显得更为正式与重要。
练习代码：
Web小白基础教程
Web小白基础教程
Web小白基础教程
Web小白基础教程
Web小白基础教程
Web小白基础教程
Web小白基础教程
Web小白基础教程
效果如下：
二、图片标签——单标签
注：编译于
注：标签属性名用于修饰标签，放于标签<属性>之内。
| 标签属性名 | 标签属性值 | 效果说明 |
| src | “图片文件存放地址” | 显示图片 |
| alt | “图片因某些原因不能显示，此时出现的替换文字” | 替换文字 |
| title | “鼠标悬停在图片上显示的提示文本” | 悬浮文字 |
| width | “图片的宽度” | 设置宽度 |
| heiht | “图片的高度” | 设置高度 |
注①：一般情况下，图片设置只需要设置宽或者高其中一个属性值即可，另外一个属性值则会按照图片比例等比例缩放，不改变图片呈现的效果。
注②：常用的图片格式有三种：
-
jpg:有损压缩——>会影响画质——>图片会比较小——>没有透明通道;
-
png: 无损压缩 ——> 不影响画质——> 比jpg的图片大——> 有了背景才能看出来透明通道;
-
gif：动图
注③：图片引用地址（引号为英文引号，且必须带上扩展名）：
1、绝对路径——在本地保存的图片文件，从盘符开始的完整路径——一般不会使用
例如：
2、相对路径——在本地保存的图片文件，从当前路径进行操作的路径——推荐使用
例如：
3.在线网址路径——连接网络后在网站上引用的在线文件——酌情使用
例如：https://www.baidu.com/图片.jpg">
注④：相对路径的表示：
（1）同级文件夹（两种表示，推荐第一种）
①
注：上述代码中的“./”代表在当前文件夹检索文件，VSCode会自动检索出当前文件夹所有文件以供选择。
②
（2）下级文件夹（存放在与自己同级的文件夹之中，需要进行【进入】操作）
（3）上级文件夹（存放在比自己上级的文件夹之中，需要进行【返回】操作）
可能这么一说文字感觉略有点绕口，难理解，话不多说，上图！
练习代码：
效果如下：
三、音频标签——双标签
注：编译于
音频注：标签属性名用于修饰标签，放于标签<属性>之内。
| 标签属性名 | 标签属性值 | 效果说明 |
| src | "音频的相对路径" | 导入音频 |
| controls | 无 | 显示播放音频的控件 |
| autoplay | 无 | 自动播放音频（部分浏览器不支持） |
| loop | 无 | 自动循环播放音频 |
练习代码与视频标签练习代码一同呈上。
效果与视频标签效果一同呈上。
四、视频标签——双标签
注：编译于
注：标签属性名用于修饰标签，放于标签<属性>之内。
| 标签属性名 | 标签属性值 | 效果说明 |
| src | “视频的相对路径” | 导入视频 |
| controls | 无 | 显示播放视频的控件 |
| autoplay | 无 | 自动播放视频（部分浏览器不支持） |
| loop | 无 | 循环播放视频 |
| muted | 无 | 静音播放视频 |
练习代码：
圣诞节的那些事儿
圣诞快乐！
效果如下：
五、链接标签——双标签
链接标签又被称为“超链接”、“a标签”、“锚标签”，目标i网址又被称为“锚点”。
注：编译于
超链接注：标签属性名用于修饰标签，放于标签<属性>之内。
注：若编译过程中跳转网址未知，则可用“#”代替。超链接自带颜色和下划线，颜色不同无需在意。
注：若需跳转本地网址，修改
| 标签属性名 | 标签属性值 | 效果说明 |
| href | “目标网页的路径” | 跳转网页 |
| target | “_self”(默认) | 在当前窗口跳转，不新开网页 |
| target | “_blank” | 在新窗口跳转网页 |
练习代码：
新窗口打开“百度一下”
原窗口打开“百度一下”
不修改target属性值，原窗口打开“百度一下”
效果如下：
暑期编程PK赛 得CSDN机械键盘等精美礼品！
