HTML初学者会经常遇到这样一个问题,如何正确引用一个文件。比如,怎样在一个HTML网页中引用另外一个HTML网页作为超链接(hyperlink)?怎样在一个网页中插入一张图片?......
如果你在引用文件时(如加入超链接,或者插入图片等),使用了错误的文件路径,就会导致引用失效(无法浏览链接文件,或无法显示插入的图片等)。
为了避免这些错误,正确地引用文件,我们需要学习一下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超链接的代码应该这样写:
<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超链接的代码应该这样写:
<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超链接的代码应该这样写:
<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超链接的代码应该这样写:
<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超链接的代码应该这样写:
<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超链接的代码应该这样写:
<a href = "html/tutorials/index.html">index.html</a>
HTML绝对路径(Absolute Path)
HTML绝对路径(absolute path)指带域名的文件的完整路径。
假设你注册了域名www.blabla.cn,并申请了虚拟主机,你的虚拟主机提供商会给你一个目录,比如www,这个www就是你网站的根目录。
假设你在www根目录下放了一个文件index.html,这个文件的绝对路径就是: http://www.blabla.cn/index.html。
假设你在www根目录下建了一个目录叫html_tutorials,然后在该目录下放了一个文件index.html,这个文件的绝对路径就是http://www.blabla.cn/html_tutorials/index.html。
转载自:http://www.blabla.cn/html_tutorials/022_html_path.html
分享到:
相关推荐
C#根据当前进程的启动路径,获得多个参数拼接...以及根据基准路径和参数获得相对路径。路径操作只用.NET中的System.IO和System.Text命名空间,相比其它的实现方式(比如采用System.Web命名空间)实用性更强,依赖更少。
在探讨路径操作之前,我们首先需要理解绝对路径和相对路径的基本概念。 **绝对路径**指的是从根目录开始直到文件所在位置的完整路径。这种路径方式明确无误,但在某些场景下可能不够灵活,尤其是在需要跨平台使用的...
本教程“python爬虫-08-绝对路径和相对路径”旨在深入讲解这两种路径的概念及其在爬虫项目中的应用。 首先,让我们理解什么是绝对路径。绝对路径是从根目录开始,完整描述文件或目录位置的路径。在Windows系统中,...
有两种主要的路径类型:绝对路径和相对路径,它们在程序中有着不同的用途和处理方式。这篇文章将详细讲解如何在Java中区分这两种路径以及如何使用它们。 **绝对路径**: 绝对路径是从根目录开始的完整路径,它指明...
### Java中的绝对路径与相对路径 在Java编程中,路径管理是进行文件操作的重要组成部分,尤其是在Web应用开发中。本文将详细介绍如何在Java中获取不同类型的路径,包括Web服务器下的文件路径、本地路径以及相对路径...
WPF 中 Image 控件 Source 属性的相对路径和绝对路径问题总结 在 WPF 中,Image 控件的 Source 属性可以指定为相对路径或绝对路径,但这两种路径有不同的使用场景和注意事项。本文将总结 WPF 中 Image 控件 Source ...
在JSP开发中,合理选择绝对路径与相对路径对于提高页面间的跳转效率和资源加载成功率非常重要。理解它们的区别及应用场景有助于开发者更好地组织和管理Web应用的结构。同时,需要注意forward与资源加载之间的潜在...
在编程和系统管理中,了解和正确使用绝对路径与相对路径是至关重要的。尤其是在Perl这样的脚本语言中,路径的处理对于程序的正确执行起到关键作用。本文将深入解析这两个概念,帮助新手清晰理解它们的区别和用法。 ...
### 理解Python中的绝对路径与相对路径 在Python编程过程中,经常需要处理文件路径。文件路径可以分为两种类型:绝对路径和相对路径。掌握这两种路径的概念及其使用方法对于进行文件操作至关重要。 #### 一、绝对...
### 相对路径和绝对路径的区别与使用 在计算机科学领域,路径是文件系统中用于标识文件或目录位置的一种方式。路径可以分为两种主要类型:绝对路径和相对路径。了解这两种路径的区别及其适用场景对于软件开发、网页...
**总结**:在实际开发中,相对路径和绝对路径各有优势。相对路径更适用于同一站点内的链接,可以简化代码并提高可移植性;而绝对路径则适用于跨站点或跨服务器的情况,特别是在引用外部资源时更加稳定可靠。开发者应...
在进行QTP自动化测试时,合理地使用绝对路径和相对路径可以提高测试脚本的可移植性和维护性。通常,以下是一些使用建议: - 对于固定的、不会变动的资源,如安装目录中的库文件,可以使用绝对路径。 - 对于经常变动...
Linux运维-运维课程运维基本功d2-基本命令-15-ls命令与绝对路径和相对路径.mp4
路径分为绝对路径和相对路径两种类型,它们各有不同的用途和特点。 绝对路径是指从根目录开始的完整路径,它明确指定了文件或目录的确切位置。例如,`file:/D:/java/eclipse32/workspace/jbpmtest3/bin/aaa.b` 是一...
有两种主要类型的路径:绝对路径和相对路径。绝对路径是从根目录开始的完整路径,而相对路径是相对于当前工作目录的路径。本篇文章将深入探讨绝对路径与相对路径的概念、它们之间的转换以及如何在C++、Java和Python...
2. JSP/Servlet 中的相对路径和绝对路径 在 JSP/Servlet 中,路径问题非常重要,正确的理解和使用路径可以避免许多问题。 2.1 服务器端的地址 在 JSP/Servlet 中,服务器端的相对地址指的是相对于当前 Web 应用的...
本文将详细讲解Java项目中的绝对路径和相对路径,并提供一些实际应用中的注意事项。 首先,让我们了解一下**绝对路径**。绝对路径是完全指定的、不依赖于当前工作目录的文件或目录位置。它包括了文件系统的所有层次...
html图像标签、绝对路径和相对路径html图像标签、绝对路径和相对路径html图像标签绝对路径和相对路径 2.5. html图像标签、绝对路径和相对路径 绝对路径和相对路径 像网页上插入图片这种外部文件,需要定义文件的...