路径 | 描述 |
---|---|
<img src="logo.jpg"> | logo.jpg 位于与当前网页相同的文件夹 |
<img src="logo/logo.jpg"> | logo.jpg 位于当前文件夹的 logo文件夹中 |
<img src="/logo/logo.jpg"> | logo.jpg 位于当前站点根目录的 logo 文件夹中 |
<img src="../logo.jpg"> | logo.jpg 位于当前文件夹的上一级文件夹中 |
HTML 文件路径
文件路径描述了网站文件夹结构中某个文件的位置。
文件路径会在链接外部文件时被用到:
- 网页
- 图像
- 样式表
- JavaScript
绝对文件路径
绝对文件路径是指向一个因特网文件的完整 URL:
实例
html
\<img src="https://www.ngrok.cn/statics/img/logo/indexlogo@2x.png" alt="Logo"\>
<img> 标签以及 src 和 alt 属性在 HTML 图像这一章做了讲解。
相对路径
相对路径指向了相对于当前页面的文件。
在本例中,文件路径指向了位于当前网站根目录中 logo 文件夹里的一个文件:
实例
html
<img src="/statics/img/logo/indexlogo@2x.png" alt="Logo">
在本例中,文件路径指向了位于当前文件夹中 logo 文件夹里的一个文件:
实例
html
<img src="statics/img/logo/indexlogo@2x.png" alt="Logo">
在本例中,文件路径指向了位于当前文件夹的上一级文件夹中 logo 文件夹里的一个文件:
实例
html
<img src="../statics/img/logo/indexlogo@2x.png" alt="Logo">
好习惯
使用相对路径是个好习惯(如果可能)。
如果使用了相对路径,那么您的网页就不会与当前的基准 URL 进行绑定。所有链接在您的电脑上 (localhost) 或未来的公共域中均可正常工作。