HTML相对路径和绝对路径

如果你在引用文件时(如加入超链接,或者插入图片等),使用了错误的文件路径,

就会导致引用失效(无法浏览链接文件,或无法显示插入的图片等)。

为了避免这些错误,正确地引用文件,我们需要学习一下HTML路径。


HTML有2种路径的写法:相对路径和绝对路径。

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超链接的代码应该这样写:

  1. <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超链接的代码应该这样写:

  1. <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超链接的代码应该这样写:

  1. <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超链接的代码应该这样写:

  1. <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超链接的代码应该这样写:

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

复制代码

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

假设index.html路径是:

c:\Inetpub\wwwroot\sites\blabla\html\tutorials\index.html

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

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

复制代码

HTML绝对路径(Absolute
Path)


HTML绝对路径(absolute path)指带域名的文件的完整路径。

假设你注册了域名xinran001.com,并申请了虚拟主机,你的虚拟主机提供商会给你一个目录,比如www,这个www就是你网站的根目录。

假设你在www根目录下放了一个文件index.html,这个文件的绝对路径就是:


http://www.xinran001.com/index.html

假设你在www根目录下建了一个目录叫bbs,然后在该目录下放了一个文件index.php,这个文件的绝对路径就是

http://www.xinran001.com/bbs/index.php

HTML相对路径和绝对路径,布布扣,bubuko.com

时间: 2024-08-06 07:51:23

HTML相对路径和绝对路径的相关文章

eclipse部署tomcat修改项目访问路径(虚拟路径)

原文参考: http://www.educity.cn/wenda/147993.html http://blog.163.com/java_zf/blog/static/19926038420129240314546/ tomcat部署web项目(eclipse自动部署项目到tomcat,访问URL中不包含部署名) 最近项目中需要把项目部署到tomcat中,并且访问路径中不包含不署名,且想实现Eclipse中的自动部署,扒了好久资料,最终实现了自己的需求,呵呵,如下: 1. 把项目contex

绝对路径和相对路径

HTML初学者会经常遇到这样一个问题,如何正确引用一个文件. 比如,怎样在一个HTML网页中引用另外一个HTML网页作为超链接(hyperlink)?怎样在一个网页中插入一张图片? 如果你在引用文件时(如加入超链接,或者插入图片等),使用了错误的文件路径,就会导致引用失效(无法浏览链接文件,或无法显示插入的图片等). 为了避免这些错误,正确地引用文件,我们需要学习一下HTML路径. 在我们平时使用计算机时要找到需要的文件就必须知道文件的位置,而表示文件的位置的方式就是路径 1.绝对路径:是从盘符

网站中图片的相对路径与绝对路径

1.相对路径 网站中加载图片所用到的相对路径,相对路径是以网页所在位置为参考的. ../代表上一级目录 src="../../photo/1.png"; src="images/1.jpg"; 2.绝对路径

浅谈 qmake 之 shadow build(就是将源码路径和构建路径分开)

shadow build shadow build 是什么东西?就是将源码路径和构建路径分开(也就是生成的makefile文件和其他产物都不放到源码路径),以此来保证源码路径的清洁. 这不是qmake独创的东西,cmake中早就使用这个东西了   cmake qmake 备注 in-source cmake . qmake project.pro 在源码路径下执行 out-of-source(shadow-build) mkdir build cd buildcmake ../project m

[原创]java WEB学习笔记35:java WEB 中关于绝对路径 和相对路径问题

本博客为原创:综合 尚硅谷(http://www.atguigu.com)的系统教程(深表感谢)和 网络上的现有资源(博客,文档,图书等),资源的出处我会标明 本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱好者,互联网技术发烧友 微博:伊直都在0221 QQ:951226918 ---------------------------------

java(web)相对路径,绝对路径

1.定义 绝对路径:绝对路径就是你的主页上的文件或目录在硬盘上真正的路径,(URL和物理路径)例如:C:/xyz/test.txt 代表了test.txt文件的绝对路径.http://www.baidu.com/index.htm也代表了一个URL绝对路径. 相对路径:相对与某个基准目录的路径.包含Web的相对路径(HTML中的相对目录),例如:在Servlet中,"/"代表Web应用的根目录.和物理路径的相对表示.例如:"./" 代表当前目录,"../&

关于相对路径和绝对路径

相对路径:以引用文件之网页所在位置为参考基础,而建立出的目录路径.因此,当保存于不同目录的网页引用同一个文件时,所使用的路径将不相同,故称之为相对. 绝对路径:以Web 站点根目录为参考基础的目录路径.之所以称为绝对,意指当所有网页引用同一个文件时,所使用的路径都是一样的. 其实绝对路径与相对路径的不同处,只在于描述目录路径时,所采用的参考点不同.由于对网站上所有文件而言,根目录这个参考点对所有文件都是一样的,因此,运用以根目录为参考点的路径描述方式才会被称之为绝对路径 二.路径特殊符号   -

相对路径和绝对路径

路径是指文件在服务器中的存储位置.我们在使用计算机时要找到所需的文件时就必须知道文件的绝对路径,例如,只要看到这个路径d:/web/logo.gif,我们就知道logo.gif文件是在d盘的web目录下.类似于这样完整的描述文件位置的路径就是绝对路径.绝对路径还有一种表示方法就是以服务器命名开始(如在本机中http://localhost)的完整描述文件位置的路径,如通过IIS简历一个站点,站点下面有个文件叫test.htm,那么用绝对路径来显示这个文件就是http://localhost//t

[Asp.net]绝对路径和相对路径

目录 绝对路径 相对路径 总结 绝对路径 绝对路径就是你的主页上的文件或目录在硬盘上真正的路径.比如:E:\新概念英语\新版新概念英语第二册课文PDF.pdf.以Web 站点根目录为参考基础的目录路径.之所以称为绝对,意指当所有网页引用同一个文件时,所使用的路径都是一样的. 1 "/" -- 代表根目录,绝对路径. 2 如:<a href="/abc">文本</a> 或 <img src="/abc" /> 3

Python中的绝对路径和相对路径

大牛们应该对路径都很了解了,这篇文章主要给像我这样的入门小白普及常识用的,啊哈 下面的路径介绍针对windows,其他平台的暂时不是很了解. 在编写的py文件中打开文件的时候经常见到下面其中路径的表达方式: [python] view plain copy open('aaa.txt') open('/data/bbb.txt') open('D:\\user\\ccc.txt') 这三种表达式里面,前两个都是相对路径,第三个则是绝对路径.绝对路径比较好理解,就是最完整的路径,相对路径的相对则是