请选择 进入手机版 | 继续访问电脑版

湖南新梦想

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 637|回复: 0

HTML相对路径与绝对路径

[复制链接]

16

主题

17

帖子

101

积分

注册会员

Rank: 2

积分
101
发表于 2022-11-27 22:23:41 | 显示全部楼层 |阅读模式
在网页制作的过程中,少不了跟路径打交道,比如,包含一个文件,插入一个图片等,与路径都有关系,如果使用了错误的文件路径,就会导致引用失效(无法浏览链接文件,或无法显示插入的图片等)。

HTML的2种路径写法:相对路径和绝对路径
1.HTML相对路径(Relative Path)
用途:指定由这个文件所在的路径引起的跟其它文件(或文件夹)的路径关系

如果源文件和引用文件在同一个目录里,直接写引用文件名即可,这时引用文件的方式就是使用相对路径。

下面建立两个HTML文档info.html和index.html,用作示例,要求都是在info.html加入index.html超链接。

eg1:相对路径的简单应用

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

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

写法:<a href = "index.html">这是超连接</a>

eg2:如何表示上级目录

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

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

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

写法:<a href = "../index.html">这是超连接</a>

eg3:如何表示上上级目录

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

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

写法:<a href = "../wowstory/index.html">index.html</a>

eg3:如何表示下级目录

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

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

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

写法:<a href = "html/index.html">这是超连接</a>

2.HTML绝对路径(Absolute Path)
大家都知道,在我们平时使用计算机时要找到需要的文件就必须知道文件的位置,而表示文件的位置的方式就是路径。

例如只要看到这个路径:c:/website /img/photo.jpg我们就知道photo.jpg文件是在c盘的website目录下的img子目录中。

类似于这样完整的描述文件位置的路径就是绝对路径。我们不需要知道其他任何信息就可以根据绝对路径判断出文件的位置。
————————————————
版权声明:本文为CSDN博主「xinianbuxiu」的原创文章,
原文链接:https://blog.csdn.net/xinianbuxiu/article/details/53248389

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|小黑屋|湖南新梦想 ( 湘ICP备18019834号-2 )

GMT+8, 2023-2-7 10:45 , Processed in 0.040519 second(s), 19 queries .

Powered by Discuz! X3.4 Licensed

Copyright © 2001-2020, Tencent Cloud.

快速回复 返回顶部 返回列表