url中相对路径和绝对路径

经常在页面中引用图片,html页面等,自己常常弄错相对路径和绝对路径,今天写下此文总结一下。
直接举例说明吧。

在 D:\例子\html下有这么几个文件和文件夹

[img]http://dl.iteye.com/upload/attachment/390779/e1f28f9e-090c-35ae-b1a5-34357ac54cc0.png[/img]

1.若引用的资源和本身在同一路径下(既在同一目录下)

在example.html中引用tupian.gif

相对路径:<img src="tupian.gif" border="0"/>
绝对路径:<img src="d:/例子/html/tupian.gif" border="0"/>

绝对的都差不多,只说相对路径。

2 要引用的文件在下一级文件夹下,文件名前加子文件夹名称
假设info.html路径是:c:\Inetpub\wwwroot\sites\blabla\info.html
假设index.html路径是:c:\Inetpub\wwwroot\sites\blabla\html\tutorials\index.html
在info.html加入index.html超链接的href应该这样写:html/tutorials/index.html

3 要引用的文件在上一级文件夹下,文件名前加../
假设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>

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

4 更复杂的情况:
假设info.html路径是:c:\Inetpub\wwwroot\sites\blabla\info.html
假设index.html路径是:c:\Inetpub\wwwroot\sites\html\index.html
在info.html加入index.html超链接的代码应该这样写:<a href="../html/index.html">index.html</a>

5.最后一个例子
假设路径:D:\例子\html\style\view\pop.css
D:\例子\html\images\view\tupian.gif
在css中引用这个图片:<img src="../../images/view/tupian.gif" border="0"/>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值