前端Html第三节记录

11-路径

        路径指的是查找文件时，从起点到终点经历的路线。

        1、相对路径：

                <-- 查找方式：从当前文件位置出发查找目标文件 -->

<img src="./imges/1.png" alt="">

                符号意义：

                "./文件夹名" 进入当前网页文件所在目录下（意指此时编写代码的" *.html "等文件所在文件夹）的其他名称的文件夹

                " /1.png "  选定某文件夹下的文件（** 编写要选定文件的全部名称 **）

                返回上层目录写法为："  ../  " （这里" / "前面有两个点，向上返回几层就加几个点）

        2、绝对路径

                查找方式：

                        Windows 电脑从盘符出发；

                        Mac 电脑从根目录（/）出发查找目标文件

<img src="C:\images\1.png">

                        此时定位的是C盘目录下的images文件夹下的1.png文件

                **  1. Windows 默认是 \ ，其他系统是 /，建议统一写为 /  **

                **  2. 特殊的绝对路径 → 文件的在线网址：如https://www.R3d.com/img/1.png " **

12-超链接标签

        点击后跳转到其他页面

<a href="https://www.baidu.com">百度</a>

        href 属性值是跳转地址，是超链接的必须属性。

·       href 的属性值也可以用上文所描述的本地文件地址。

        超链接默认是在当前窗口跳转页面，添加 target="_blank" 实现新窗口打开页面。

<a href="./Text1.html" target="_blank">在新窗口中跳转到Text1页面</a>

        **  href" " 内添加# 即为空连接，开发初期泛用。

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

13-音频

        在网页中插入音频

<audio src="音频的 URL"></audio>

        属性值：

        src: 如超链接一样  src= 后面是必须属性，编写音频的地址，支持的格式有：MP3、OGG、Wav等

        controls: 显示音频的控制面板

        loop: 循环播放模式

        autoplay: 自动播放模式（**  通常情况下会禁用自动播放功能 **）

        (延伸知识：在编写html5代码时，如果属性名与属性值相同，可以简写成一个词)

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

14-视频

        在网页中插入视频

<video src="./media/vue.mp4"></video>

        属性值：

                src: 如超链接一样  src= 后面是必须属性，编写音频的地址，支持的格式有：MP3、OGG、Wav等

                controls: 显示音频的控制面板

                loop: 循环播放模式

                muted: 静音播放模式

                autoplay: 自动播放模式（**  通常情况下会禁用自动播放功能 **）

                想要实现自动播放视频，必须添加" muted "属性值

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