相对路径与绝对路径

经常在页面中引用图片,html页面等,总结一下绝对路径与相对路径。
绝对路径很简单,相对路径的话同级文件夹下不需要在前面加../,其他情况都要加


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

假设example.html的路径是D:/例子/example.html
假设tupian.gif的路径是D:/例子/tupian.gif
在example.html中引用tupian.gif 

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

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

要引用的文件在下一级文件夹下,文件名前加子文件夹名称

假设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

要引用的文件在上一级文件夹下,文件名前加../

假设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\sites\html\index.html 
在info.html加入index.html超链接的代码应该这样写:
<a href="../html/index.html">index.html</a> 

最后一个例子

假设路径:D:\例子\html\style\view\pop.css 
D:\例子\html\images\view\tupian.gif  
在css中引用这个图片:<img src="../../images/view/tupian.gif" border="0"/>