HTML相对路径和绝对路径

路径指文件存放的位置，在网页中利用路径可以引用文件，插入图像、视频等。表示路径的方法有两种：相对路径，绝对路径。

相对路径

相对路径是指目标相对于当前文件的路径，网页结构设计中多采用这种方法来表示目标的路径。相对路径有多种表示方法，其表示的意义不尽相同。通俗的理解，相对路径就是相对来讲的，比如我家的地址，用相对路径来描述，就是小明家隔壁就是我家，表示方法如下：

./ ：代表文件所在的目录（可以省略不写）

../ ：代表文件所在的父级目录

../../ ：代表文件所在的父级目录的父级目录

/ ：代表文件所在的根目录

值得注意的是，（/ ：代表文件所在的根目录）其实可以理解成项目内部的绝对路径。

图1：项目目录结构

以图1所示项目目录结构为例，如果要在hwy.html中引入111.jpg，可以有以下写法：<img src="./playDemo/images/111.jpg" alt="">

绝对路径

如果用绝对路径来表示我家的地址，就是中国某省某市某县某小区某单元101室，在网页里，绝对路径是指完整的网址，假设图一中项目的网站域名为www.test.com，那么111.jpg的绝对路径应该是  https://www.test.com/playDemo/images/111.jpg。

相对路径与绝对路径的优缺点

绝对路径的优点
1.如果有人抄袭你的网站内容，里面的链接还会指向你的网站，有些抄袭的人比较懒，根本不会去改内容。其实也不局限于被抄袭，如果有人将你的网页保存到本地电脑中，里面的链接、图片、css、以及js仍然会连接到你的网站。
2.如果网页位置改变，里面的链接还是指向正确的URL。

绝对路径的缺点：
1.如我上面所述，在本机制作的时候不能使用绝对路径，因为链接应该指向真正的域名而不是测试机的。
2.内容页面必须固定，如果所有内容页面都使用绝对路径，那么要修改一个文件，其它页面上的路径无法变化，还会指向原来的地址。

相对路径的优缺点
相对路径的优缺点和绝对路径几乎相反。
优点：
1.容易移动内容，可以整个目录移动。
2.测试方法比较灵活，就是我所说的本机测试时比较方便。

 缺点：
1.内容页面换了位置时，链接容易失效。
2.容易被人大面积采集抄袭。

注意：

有人说使用绝对路径可以有利于搜索引擎抓取，其实相对路径一样不影响搜索抓取。
路径要尽可能的减少，最好不多于4层链接，这样是有利于搜索引擎抓取的。