首页 > web前端技术 > html5 > 了解这3点,就可以分清当前目录与根目录、相对路径与绝对路径了

了解这3点,就可以分清当前目录与根目录、相对路径与绝对路径了

工作中,很多人对当前目录、根目录、相对路径、绝对路径始终分不清楚,今天,白龙网为大家分享下相关知识点。

1.HTML文件路径的表示方法
路径                                                         描述
<img src="picture.jpg"> picture.jpg 位于与当前网页相同的文件夹;<img src="./picture.jpg">表示当前路径,一般省略“./”;
<img src="images/picture.jpg"> picture.jpg 位于当前文件夹的 images 文件夹中
<img src="/images/picture.jpg"> picture.jpg 当前站点根目录的 images 文件夹中
<img src="../picture.jpg"> picture.jpg 位于当前文件夹的上一级文件夹中
文件路径描述了网站文件夹结构中某个文件的位置。文件路径会在链接外部文件时被用到:网页、图像、样式表、JavaScript。
 
2.绝对文件路径
绝对文件路径是指向一个因特网文件的完整 URL:
<img src="https://www.abc.com.cn/images/picture.jpg" alt="flower">
 
3.相对路径
相对路径指向了相对于当前页面的文件。文件路径指向了位于当前网站根目录中images文件夹里的一个文件:
<img src="/images/picture.jpg" alt="flower">
在本例中,文件路径指向了位于当前文件夹中 images 文件夹里的一个文件:
<img src="images/picture.jpg" alt="flower">
在本例中,文件路径指向了位于当前文件夹的上一级文件夹中 images 文件夹里的一个文件:
<img src="../images/picture.jpg" alt="flower">
使用相对路径是个好习惯(如果可能)。如果使用了相对路径,那么您的网页就不会与当前的基准URL进行绑定。所有链接在您的电脑上(localhost)或未来的公共域中均可正常工作。
 

相关推荐