【小白专用】HTML相对路径表示方法

一. HTML相对路径(Relative Path)

同一个目录的文件引用

如果源文件和引用文件在同一个目录里,直接写引用文件名即可。

我们现在建一个源文件info.html,在info.html里要引用index.html文件作为超链接。

假设info.html路径是:c:/Inetpub/wwwroot/sites/blabla/info.html

假设index.html路径是:c:/Inetpub/wwwroot/sites/blabla/index.html

在info.html加入index.html超链接的代码应该这样写:

<a href = "index.html">index.html</a>

如何表示上级目录

../表示源文件所在目录的上一级目录,../../表示源文件所在目录的上上级目录,以此类推。

假设info.html路径是:c:/Inetpub/wwwroot/sites/blabla/info.html

假设index.html路径是:c:/Inetpub/wwwroot/sites/index.html

在info.html加入index.html超链接的代码应该这样写:

<a href = "../index.html">index.html</a>

假设info.html路径是:c:/Inetpub/wwwroot/sites/blabla/info.html

假设index.html路径是:c:/Inetpub/wwwroot/index.html

在info.html加入index.html超链接的代码应该这样写:

<a href = "../../index.html">index.html</a>

假设info.html路径是:c:/Inetpub/wwwroot/sites/blabla/info.html

假设index.html路径是:c:/Inetpub/wwwroot/sites/wowstory/index.html

在info.html加入index.html超链接的代码应该这样写:

<a href = "../wowstory/index.html">index.html</a>

如何表示下级目录

引用下级目录的文件,直接写下级目录文件的路径即可。

假设info.html路径是:c:/Inetpub/wwwroot/sites/blabla/info.html

假设index.html路径是:c:/Inetpub/wwwroot/sites/blabla/html/index.html

在info.html加入index.html超链接的代码应该这样写:

<a href = "html/index.html">index.html</a>

相关推荐
代码搬运媛2 小时前
React 中 HTML 插入的全场景实践与安全指南
安全·react.js·html
lljss20205 小时前
html文字红色粗体,闪烁渐变动画效果,中英文切换版本
css·html·css3
疯狂的沙粒6 小时前
在web-view 加载的本地及远程HTML中调用uniapp的API及网页和vue页面是如何通讯的?
前端·uni-app·html
小妖6666 小时前
html 滚动条滚动过快会留下边框线
前端·html
CodeBlossom13 小时前
javaweb -html -CSS
前端·javascript·html
鱼馅饼17 小时前
vscode使用系列之快速生成html模板
ide·vscode·html
然我21 小时前
JavaScript的OOP独特之道:从原型继承到class语法
前端·javascript·html
冷凌爱21 小时前
总结HTML中的文本标签
前端·笔记·html
灏瀚星空1 天前
用HTML5 Canvas打造交互式心形粒子动画:从基础到优化实战
前端·html·html5
Teln_小凯1 天前
Python读取阿里法拍网的html+解决登录cookie
开发语言·python·html