当前位置: 首页 > news >正文

XHTML 相对路径与绝对路径

文件路径

文件路径就是文件在电脑(服务器)中的位置,表示文件路径的方式有两种:相对路径和绝对路径。
路径标识: 标识符号     说明
/     路径标识
.     当前目录
..     上一层目录

“.”和“..”常与“/”结合使用表示各个路径层次:
路径     说明
./     当前路径,可省略
/     网站根目录,为绝对路径
../     上一层目录,可重复使用,如../../,表示上上层目录
相对路径(Relative Path)

相对路径就是指由这个文件所在的路径引起的跟其它文件(或文件夹)的路径关系。使用相对路径可以为我们带来非常多的便利,大部分情况下我们使用的是相对路径。

相对路径的例子:

<img src="images/flower_1.jpg" alt="花朵" />

这个是在我们例子主页index.html里img标签使用相对路径标识图像来源的例子。

在该例子中,index.html存放于E:/hmtl中,而图像位置为E:/html/images/flower_1.jpg中。图像相对于index.html的路径就是images/flower_1.jpg。

下面的写法效果是一样的:

<img src="./images/flower_1.jpg" alt="花朵" />

也就是说,通常对于当前路径,可以采用省略的写法,浏览器默认为当前路径。

如果在index.html同目录下有个1.html,那么要从index.html做一个链接到1.html,使用相对路径:

<a href="1.html">从index.html链接到当前目录的1.html</a>

如果1.html在E:/hmtl/test目录下,要从1.html做一个链接到index.html和使用图片目录下的图片,使用相对路径:

<a href="../index.html">从1.html链接到上一层目录的index.html</a>
<p>指定图片:</p>
<img src="../images/flower_1.jpg" alt="花朵" />

绝对路径(Absolute Path)

绝对路径一般是指带有网址的路径,非本站外的资源都要使用绝对路径。如本站引用thinkphp.cn的图片链接

<a href="http://www.thinkphp.cn/" target="_blank"><img src="http://www.thinkphp.cn/logo88X31.gif" /></a>

在该例子中,对超链接标签和图像标签里的属性都使用了绝对路径。
网站根目录

网站根目录用“/”表示,是一种特殊的绝对路径,它表示网站(本站)的第一层次。

使用绝对路径的例子:

<img src="/images/flower_1.jpg" alt="花朵" />

等效于:

<img src="http://www.5idev.com/images/flower_1.jpg" alt="花朵" />

使用根路径其优点是比较直观,计算方式是从根目录开始计算,缺点是如果内容层次发生了变化哪怕产生了同级的变动,都需要变动目录写法。 

 

转载于:https://www.cnblogs.com/jerrypro/p/6414687.html

相关文章:

  • 算法笔记_037:寻找和为定值的两个数(Java)
  • HttpURLConnection getContentLength();返回时-1或者是0
  • 编辑器
  • SUSE Linux 11架设Apache虚拟主机
  • PCL点云库在VS2010下的编译环境配置
  • MapReduce机制
  • json反序列化成实体存入数据库
  • C/C++自实现的函数(memset, memcpy, atoi)
  • yii2之创建管理员
  • 使用Hive Rest API 连接HDInsight
  • oracle 批量改temp/data/redo file的路径
  • MAPZONE GIS SDK接入Openlayers3之三——瓦片数据集接入
  • php学习1
  • 机器学习之线性回归---logistic回归---softmax回归
  • php导出pdf
  • 【JavaScript】通过闭包创建具有私有属性的实例对象
  • ES10 特性的完整指南
  • js数组之filter
  • js算法-归并排序(merge_sort)
  • Next.js之基础概念(二)
  • PHP那些事儿
  • Xmanager 远程桌面 CentOS 7
  • 机器学习学习笔记一
  • 近期前端发展计划
  • 猫头鹰的深夜翻译:JDK9 NotNullOrElse方法
  • 免费小说阅读小程序
  • 什么是Javascript函数节流?
  • 提醒我喝水chrome插件开发指南
  • 推荐一个React的管理后台框架
  • 项目实战-Api的解决方案
  • elasticsearch-head插件安装
  • 树莓派用上kodexplorer也能玩成私有网盘
  • ​linux启动进程的方式
  • #QT(智能家居界面-界面切换)
  • #我与Java虚拟机的故事#连载10: 如何在阿里、腾讯、百度、及字节跳动等公司面试中脱颖而出...
  • (1)Android开发优化---------UI优化
  • (C语言)球球大作战
  • (M)unity2D敌人的创建、人物属性设置,遇敌掉血
  • (poj1.2.1)1970(筛选法模拟)
  • (转)winform之ListView
  • ***微信公众号支付+微信H5支付+微信扫码支付+小程序支付+APP微信支付解决方案总结...
  • .gitattributes 文件
  • .gitignore文件—git忽略文件
  • .NET Compact Framework 多线程环境下的UI异步刷新
  • .Net8 Blazor 尝鲜
  • .net连接oracle数据库
  • @converter 只能用mysql吗_python-MySQLConverter对象没有mysql-connector属性’...
  • @我的前任是个极品 微博分析
  • [ C++ ] template 模板进阶 (特化,分离编译)
  • [ SNOI 2013 ] Quare
  • [ vulhub漏洞复现篇 ] Apache APISIX 默认密钥漏洞 CVE-2020-13945
  • [2019.3.5]BZOJ1934 [Shoi2007]Vote 善意的投票
  • [AAuto]给百宝箱增加娱乐功能
  • [android] 看博客学习hashCode()和equals()
  • [C#]科学计数法(scientific notation)显示为正常数字