HTML 文件路径
HTML 文件路径,包含相对路径和绝对路径,下面我们来看下我们html中常使用img图片路径的一些示例。
路径 | 描述 |
---|---|
<img src=”picture.jpg”> | picture.jpg 与当前页面位于同一文件夹中 |
<img src=”images/picture.jpg”> | picture.jpg位 于当前文件夹中的images文件夹中 |
<img src=”/images/picture.jpg”> | picture.jpg 位于当前网站根目录下的images文件夹中 |
<img src=”../picture.jpg”> | picture.jpg 位于距当前文件夹一级的文件夹中 |
HTML文件路径
文件路径描述了网站文件夹结构中文件的位置。
链接到外部文件时使用文件路径,如:
- 网页
- 图片
- 样式表
- JavaScripts
绝对文件路径
绝对文件路径是Internet文件的完整URL:
示例
<img src="https://www.w3.org/2008/site/images/logo-w3c-mobile-lg" alt="Mountain">
在HTML 图像的章节中解释了
<img>
标签以及src和alt属性。
相对文件路径
相对文件路径指向相对于当前页面的文件。
在此示例中,文件路径指向位于当前Web根目录的images文件夹中的文件:
示例
<img src="/images/picture.jpg" alt="Mountain">
在此示例中,文件路径指向位于当前文件夹中的images文件夹中的文件:
示例
<img src="images/picture.jpg" alt="Mountain">
在此示例中,文件路径指向位于当前文件夹上一级文件夹中的images文件夹中的文件:
示例
<img src="../images/picture.jpg" alt="Mountain">
最佳实践
最佳做法是使用相对文件路径(如果可能)。
使用相对文件路径时,您的网页不会绑定到当前的基本URL。所有链接都可以在您自己的计算机(localhost)以及您当前的公共域和未来的公共域上运行。
原创文章,作者:ItWorker,如若转载,请注明出处:https://blog.ytso.com/59263.html