相对路径和绝对路径要如何选择？

0 432 2021-05-11 02:00:01

本文目录

1. 相对路径
2. 绝对路径
3. 相对路径与绝对路径的优缺点

路径指文件存放的位置，在网页中利用路径可以引用文件，插入图像、视频等。表示路径的方法有两种：相对路径，绝对路径。我们何时用相对路径，何时用绝对路径呢？

相对路径和绝对路径要如何选择？

相对路径

相对路径是指目标相对于当前文件的路径，网页结构设计中多采用这种方法来表示目标的路径。相对路径有多种表示方法，其表示的意义不尽相同。表示方法如下：

./ ：代表文件所在的目录（可以省略不写）

../ ：代表文件所在的父级目录

../../ ：代表文件所在的父级目录的父级目录

/ ：代表文件所在的根目录

值得注意的是，（/ ：代表文件所在的根目录）其实可以理解成项目内部的绝对路径。

我们在引入css文件时，可以有以下写法：

1、<link href="./css/style.css"/> (./可以省略)
2、<link href="/html/css/style.css"/>
3、<link href="../html/css/style.css"/>

绝对路径

绝对路径是指一个绝对成立的路径，假设图一中项目的网站域名为www.xzo.com.cn，那么style.css的绝对路径应该是

https://www.xzo.com.cn/html/css/css/style.css。

相对路径与绝对路径的优缺点

简单的说，相对路径，可以在整个项目移动时正确引用；而绝对路径，可以在单个文件移动时依然保证正确引用。

以上就是相对路径和绝对路径的介绍与分析，相信现在你对于该使用相对路径还是绝对路径已经有了自己的看法。

本文地址：https://xzo.com.cn/develop/js/935.html

有帮助，很赞！

信息来源：下载鸥

业务合作

如果您认可我们的分享，有意与我们合作开展帝国cms网站建设与开发业务或插件定制，请联系右侧在线客服。我们能给您的，就是高质量的模板与售后。

版权声明

标注了信息来源为下载鸥的文章皆为原创，如果是转载的优质文章，我们也都标注了出处。如果您喜欢我们的文章，请按照下载鸥所标注的文章出处进行标注，谢谢您的配合。

信息标签

html

CSS

jQuery

CSS3之弹性盒子布局flex（文字版） jQuery怎样实现全选反选、选中奇数偶数？ css清除浮动导致布局错乱的3个方法 JQuery判断图片是否有alt属性，没有则自动添加 JS获取指定URL参数 web前端开发ReactJS，AngularJS, Vue.js有什么不同，哪个更好？ JS获取浏览器语言（中英文多语言站）并自动跳转代码畅言去广告JS本地文件方法 99%的网站面临JavaScript插件攻击风险使用Chrome控制台快速查找调试JavaScript运行代码自动切换导航高亮效果（基于jQuery）一段常用的css文件base.css JS年月日星期早中午时间代码帝国cms中文简体/繁体切换js插件 CSS3 鼠标上移后底部线条从中间向两边展开 js判断windows操作系统还是mac os系统 bootstrap CSS3动画：鼠标上移后顶部线条向两侧展开微信小程序和html标签比较 .getScript让JS中加载运行另一个JS文件

导出教程下载word版教程

关于JS/JQuery

JavaScript（简称“JS”）是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。JavaScript 基于原型编程、多范式的动态脚本语言，并且支持面向对象、命令式和声明式（如函数式编程）风格。

JavaScript十分强大，不管是前端页面开发、视觉动态渲染、数据交互还是后端逻辑处理，都可以通过JS实现。虽然它是作为开发Web页面的脚本语言而出名，但是它也被用到了很多非浏览器环境中。

js判断windows操作系统还是mac os系统

js网站视频播放器ckplayer和dplayer优缺点分析

Vue在npm run serve时报错Error: @vitejs/plugin-vue requires vue (>=3.2.13) or @vue/compiler-sfc to be pr

推荐JS/JQuery开发教程

jquery怎样获取textarea用户输入的行数？ jQuery是一个相当好用的js插件，通过jquery我们可以实现很多功能，例如今天要介...: 0 524

$(window).height() 和 $(document).height()有什么不同？ 我们常用$(window).height() 和 $(document).height()来监听当前高度，但这个...: 1 362

JS控制输入字数的两个方案 我们在文章输入框中经常有用到字数控制，但字数控制有两种方案，一种是字母/空...: 0 369

js点击追加信息到textarea 通过灵活运用js，我们可以轻松实现点击追加相关信息到textarea的功能。这个功...: 0 587

js判断windows操作系统还是mac os系统 网站日常访客主要是windows和mac os两种操作系统，如果网站提供资源下载，则需...: 0 1754

js网站视频播放器ckplayer和dplayer优缺点分析 dplayer和ckplayer都是非常流行的web视频播放器，二者都占有相当大的用户市场...: 0 1602

JS判断苹果iPhone与iPad、安卓设备类型适配 在网站开发的过程中，一些涉及到资源下载的网站会通过判断不同系统手机来展示...: 3 674

JS获取浏览器语言（中英文多语言站）并自动跳转代码 如果是多语言站点，主动获取浏览器默认语言并自动进行跳转可以有效降低跳出率...: 0 929

推荐插件

帝国cms纳米数据接口（足球比赛中最新数据） 帝国cms 对接纳米数据（www.nami.com）接口，本接口主要接收、整理足球比赛实时数...: 0 247

帝国cms百度、必应bing、神马推送增强收录三合一插件 因客户需要一键推送到多平台，下载鸥开发了这款一键推送至百度、必应、神马插...: 0 77

帝国cms网站会员登录与退出历史记录日志插件 帝国cms默认只有上次登录时间与ip，没有一个记录清单，所以今天，我们分享这个帝...: 0 324

帝国cms多栏目多数据表自动审核推送插件 本插件基于帝国cms帝国cms每日自动审核插件，在自动审核指定条数信息的基础上...: 0 836

帝国cms自动给正文关键词添加tag内链 帝国cms有自带的给关键词添加内链功能，但需要手动添加关键词，容易出现疏漏和...: 0 740

帝国cms百度AI图像去雾api接口对接插件 通过本插件，可以实现帝国cms网站对接百度云api实现图像去雾的功能。经过实际...: 0 408

帝国cms智能自动审核按星期几审核指定栏目带推送插件 采集站的必备资源是自动审核，要做到日收录也离不开定时发布。而本插件的自动...: 0 1200

帝国cms百度AI黑白图像上色api接口对接插件 百度开放了系列AI功能api如图像上色、图像去雾、图像修复、无损放大、清晰...: 0 357