绝对路径与相对路径，列表和表格绝对路径相对路径：上级目录、同级目录、下级目录音频标签视频标签链接标签：外部标签、

绝对路径

1.<!--盘符开头-->
    <img src="C:\Users\宋\Pictures\Camera Roll\img.jpg" >

2.<!--网络地址-->
    <img src="https://www.baidu.com/img/img.png">

相对路径

上级目录

1.上一级：../目标文件 
    <img src="../cat.gif">
2.上两级：../../目标文件
    <img src="../../cat.gif">
...

同级目录

1. 直接写目标文件
    <img src="cat.gif">
2. ./目标文件（一般用这一种，会有提示）
    <img src="./cat.gif">

下级目录

1. 目标文件夹/目标文件
    <img src="cat.gif">
2. ./目标文件夹/目标文件
    <img src="./cat.gif">

音频标签

audio:音频标签 controls:显示播放音频的控件 autoplay：音频加载完毕自动播放 loop：音频结束之后重新开始播放

<audio src="./media/1.mp3" controls autoplay loop></audio>

视频标签

video:视频标签 controls：显示播放控件 autoplay：视频加载完毕自动播放需要配合muted属性实现 loop：视频结束之后重新开始播放 (视频标签目前支持三种标签)


<video src="media/2.mp4" controls autoplay muted loop></video>

链接标签

<!-- target: 网页设置的打开方式 -->
<a href="https://www.jd.com/" target="_blank">小米商城</a>

href：链接跳转的路径（必写属性）

_blank：在新的窗口打开页面（保留原始窗口） _self：默认值在当前窗口打开页面（覆盖原有窗口）

外部链接

<a href="https://www.mi.com/ ">小米商城</a>

内部链接

<a href="./视频标签.html">跳转当前html页面</a>

下载链接

    <a href="./VSCodeUserSetup-x64-1.47.0.exe">下载</a>

文件名称必须以.exe .zip .rar结尾的后缀名文件

空链接

<a href="#">空链接</a>

列表

无序列表

<ul>
    <li></li>
</ul>

显示效果:每一项前面默认有小圆点特点:每一项都是没有顺序的

有序列表

<ol>
    <li></li>
</ol>

显示效果:每一项前面都有默认的序号特点:是有顺序的

自定义列表

<dl>
    <dt></dt>
    <dd></dd>
</dl>

dl是整体(用于包裹dt/dd标签) dt:自定义列表的主题 dd:表示自定义列表针对主题的每一项内容 dt和dd是并列关系

表格

<table>
     <!--表格的标题-->
    <caption></caption>
    <!--表格的头部-->
    <thead>
        <tr>
            <th></th>
        </tr>
    </thead>
     <!--表格的主体-->
    <tbody>
        <tr>
            <td></td>
        </tr>
    </tbody>
     <!--表格的尾部-->
    <tfoot>
        <tr>
            <td></td>
        </tr>
    </tfoot>
</table>

table:表示表格的整体 caption:表格整体大标题书写在table标签内部 th：表头单元格（默认居中加粗显示） rules:all 细线表格

表格的合并

<table border="1" width="600" height="200" align="center" rules="all">
        <tr>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
        </tr>
        <tr>
            <td></td>
            <td colspan="3"></td>
            <!-- 
            <td></td>
            <td></td>
         -->
        </tr>
        <tr>
            <td></td>
            <td rowspan="3"></td>
            <td></td>
            <td></td>
        </tr>
        <tr>
            <td></td>
            <!-- <td></td> -->
            <td></td>
            <td></td>
        </tr>
        <tr>
            <td></td>
            <!-- <td></td> -->
            <td></td>
            <td></td>
        </tr>
    </table>

合并单元格步骤：

明确合并哪几个单元格

通过左上原则，确定保留谁删除谁

上下合并---只保留最上的，删除其他

左右合并---只保留最左的，删除其他

给保留的单元格设置：跨行合并（rowspan）或者跨列合并（colspan）

注意点：

只有同一个结构标签中的单元格才能合并，不能跨结构标签合并（不能跨：thead、tbody、tfoot）