现在的位置: 首页 > 综合 > 正文

HTML绝对路径和相对路径

2016年02月24日 ⁄ 综合 ⁄ 共 725字 ⁄ 字号 评论关闭

在实际Web开发中,插入图片、包含CSS文件等都需要有路径,如果文件路径的添加错误,就会导致引用失效(无法浏览链接文件,或无法显示插入的图片等)。

有时需要处理一些html文件,像我这种不是做WEB开发的,一般使用dreamweaver就可以了,它能让我们直接操作我们需要的东西,然后自动生成代码,也就是所见即所得,使用起来非常方便。

HTML相对路径,指由这个文件所在的路径引起的跟其它文件(或文件夹)的路径关系。

相对链接的使用方法:
如果链接到同一目录下,则只需输入要链接文档的名称
如果链接到下一级目录,则需要先输入目录名,然后加 “ / ”,再输入文件名
如果连接到上一级目录,则需要先输入“../”,然后再输入目录名、文件名

HTML绝对路径
为文件提供的完全路径,包括适用的协议或盘符。也就是你的主页上的文件或目录在硬盘上真正的完整的路径。

最好还是使用相对路径,便于移植 

实例总结
现新建一个文件夹,路径为:D:\test
现有一个html文件:test.html,其路径为:D:\test\html
现有5个图片文件分别是aaa.jpg,bbb.jpg,ccc.jpg,ddd.jpg,eee.jpg
aaa.jpg的路径为:D:\test
bbb.jpg的路径为:D:\test
ccc.jpg的路径为:D:\test\html
ddd.jpg的路径为:D:\test\html\pic
eee.jpg的路径为:D:\test\pic

其目录如下:

html子目录

使用dreamweaver处理html

链接绝对路径文件

链接相对路径文件之同级目录文件

链接相对路径文件之同级子目录文件

链接相对路径文件之上级目录文件

链接相对路径文件之上级子目录文件

其总路径如下

ok,这样就完成啦!

【上篇】
【下篇】

抱歉!评论已关闭.