基础 HTML之目录问题(相对路径和绝对路径区别)
一、相对路径和绝对路径
相对路径:以引用文件之网页所在位置为参考基础,而建立出的目录路径。因此,当保存于不同目录的网页引用同一个文件时,所使用的路径将不相同,故称之为相对。
绝对路径:以Web站点根目录为参考基础的目录路径。之所以称为绝对,意指当所有网页引用同一个文件时,所使用的路径都是一样的。
其实绝对路径与相对路径的不同处,只在于描述目录路径时,所采用的参考点不同。由于对网站上所有文件而言,根目录这个参考点对所有文件都是一样的,因此,运用以根目录为参考点的路径描述方式才会被称之为绝对路径。
二、以下为建立路径所使用的几个特殊符号,及其所代表的意义。
"."—代表目前所在的目录。
".."—代表上一层目录。
"/"—代表根目录。
三、我们假设读者所建立的Web站点拥有如下图所示目录路径。
1、例如:

(1)假若要在Ref.htm文件中引用BeRef.gif文件时,其相对路径如下:
./SubDir2/BeRef.gif
上面的引用路径中,"."代表目前的目录(Dir1),所以"./SubDir2"代表目前目录下的SubDir2。其实,也可以省略"./"直接用下这个方式引用。
SubDir2/BeRef.gif
(2)若使用绝对路径以根目录为参考点引用该文件时,引用路径如下:
/Dir1/SubDir2/BeRef.gif
2、如果Web站点的目录之结构如下图时

引用BeRef.gif文件的相对路径又是如何呢?
假若要在Ref.htm文件中引用BeRef.gif文件时其相对路径如下:
../SubDir2/BeRef.gif
上面的引用路径中,".."代表上一层目录,所以,/Dir2"代表上一层目录下的Dir2子目录。若使用绝对路径引用时,则引用路径如下:
/Dir2/BeRer.gif
3、我们再举一个比较复杂的例子,来比较一下相对路径与绝对路径的使用。假设在读者所建立之Web站点中,拥有如下图的目录路径。

我们用以一个表格来说明在上图的情况下,某文件引用另一文件时,所应使用的相对路径与绝对路径。

上表中比较需要说明的是"../../"所代表的意义。
".."代表上一层目录,而"../../"所代表的是上一层目录的上一层目录。所以,从上表中可以看出,如果引用的文件存在于目前目录的子目录中,或者存在于上一层目录的 另一个子目录中,运用相对路径是比较方便的。如果不是时,则干脆利用绝对路径,还比较省事。从上表中,亦可以看出,当被引用的是同一个文件时,引用文件所使用的绝对路径是一样的。
基础 HTML之目录问题(相对路径和绝对路径区别)的更多相关文章
- 9月5日网页基础知识 通用标签、属性(body属性、路径、格式控制) 通用标签(有序列表、无序列表、常用标签)(补)
网页基础知识 一.HTML语言 HTML语言翻译汉语为超文本标记语言. 二.网页的分类 1.静态页面:在静态页面中修改网页内容实际上就是修改网页原代码,不能从后台操作,数据来只能来源于原于代码.静态网 ...
- CentOS个人目录下中文路径转英文路径
CentOS个人目录下中文路径转英文路径 如果安装了中文版到CentOS之后,root目录及home目录下会出现中文到路径名,如"桌面"."文档"," ...
- 自建目录中jsp页面访问servlet路径出错404
---恢复内容开始--- 自建目录中jsp页面访问servlet路径出错404 使用eclipse建立的项目,总是会遇到路径问题,比如jsp页面访问servlet,jsp在默认的路径.jsp在自建目录 ...
- Linux基础学习:目录配置
Linux 目录配置标准:FHS FHS:即Filesystem Hierarchy Stabdard,文件配置标准.其主要目的是希望用户可以了解已安装软件通常放置在哪个目录下. FHS根据文件系统使 ...
- php快速无限遍历递归文件夹目录、子文件,支持绝对路径和相对路径,支持返回生成数组
支持无限极遍历子文件及文件夹,支持绝对路径和相对路径! 函数说明:array glob ( string $pattern [, int $flags ] )功能:寻找与模式匹配的文件路径,返回包含匹 ...
- webpack安装包的时候 1程序目录不要在C盘 2路径不要有中文 3用cnpm
webpack安装包的时候 1程序目录不要在C盘 2路径不要有中文 3用cnpm
- 【Linux学习】Linux文件系统2—linux常用目录结构、绝对路径、相对路径
Linux文件系统2-linux常用目录结构.绝对路径.相对路径 一. 常见目录结构总结 Linux目录结构就是"树形结构",常见的目录结构: /bin 系统需要的命令位于此目录 ...
- Linux菜鸟起飞之路【四】绝对路径、相对路径及常用目录
一.绝对路径与相对路径 Linux操作系统中存在着两种路径:绝对路径和相对路径.我们在访问文件或文件夹的时候,其实都是通过路径来操作的.两种路径在实际操作中能起到同等的作用. 在开始具体介绍之前,我们 ...
- 17-Ubuntu-文件和目录命令-切换目录-相对路径和绝对路径
1.相对路径: 在输入路径时,最前面不是/或者~,表示相对当前目录所在的目录位置. 例:当前桌面目录下,通过相对路径切换到桌面目录下的Entertainment目录 2.绝对路径: 在输入路径时,最前 ...
随机推荐
- Python守护进程(多线程开发)
本段代码主要作用是httpsqs队列的消费端守护进程,从httpsqs中取出数据,放入mongodb #!/usr/bin/python import sys,time,json,logging im ...
- MVC-处理时间格式
第一种方法:先设置一个时间显示的模板,然后在需要显示时间的地方调用这个模板就行了. 1.在Share文件夹下,创建一个文件夹DisplayTemplates 2.在DisplayTemplates文件 ...
- userInteractionEnabled
NO -------是自身View下面的按钮之类的能点 YES------是View自身的按钮能点击,他下面的不能点击
- cocos2dx3.4 分割plist图片
如果想要修改一个plist文件新打包成plist,而此刻原来的小图都找不到了,那只能把plist分解了,代码如下: void UiManage::DecodePlist(string imgPath, ...
- swfupload 上传控件的配置
第一:下载swfupload控件,点击下载: 第二,解压缩后,在项目中添加这四个文件,如图: 然后,在你的js文件中添加这段代码: /** * *定义swfupload配置文件对象 **/ var s ...
- 转 scrollLeft,scrollWidth,clientWidth,offsetWidth之完全详解
scrollHeight: 获取对象的滚动高度. scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最 ...
- Android Service 生命周期和使用注意项
一.基础知识 服务一般分为两种: 1:本地服务, Local Service 用于应用程序内部.在Service可以调用Context.startService()启动,调用Context.stopS ...
- [Quick-x]移动CCEditbox的父对象导致输入框位置偏移问题
CCEditbox对象添加到某个layer,当layer移动时候,editbox输入状态下输入光标保持在原位,看起来就是光标发生了偏移 如果开始时添加的editbox不在屏幕内的话,光标会出现在屏幕边 ...
- Understanding Item Import and Debugging Problems with Item Import (Doc ID 268968.1)
In this Document Purpose Details Scenario 1: Testing the basic item import with minimum columns po ...
- Java开发所需架包官方下载
1.连接MySQL数据库所需架包点击进入官网下载 2.连接Oracle数据库所需架包点击进入官网下载 3.JUnit测试所需架包点击进入官网下载或者点击进入官网下载 4.Struts所需架包点击进入官 ...