文件路径描述了网站文件夹结构中某个文件的位置。

文件路径会在链接外部文件时被用到:

  • 网页
  • 图像
  • 样式表
  • JavaScript

绝对文件路径

绝对文件路径是指向一个因特网文件的完整 URL:

实例

<img src="https://www.w3school.com.cn/images/picture.jpg" alt="flower">

<img> 标签以及 src 和 alt 属性在 HTML 图像这一章做了讲解。

相对路径

相对路径指向了相对于当前页面的文件。

在本例中,文件路径指向了位于当前网站根目录中 images 文件夹里的一个文件:

实例

<img src="/images/picture.jpg" alt="flower">

在本例中,文件路径指向了位于当前文件夹中 images 文件夹里的一个文件:

实例

<img src="data:images/picture.jpg" alt="flower">

在本例中,文件路径指向了位于当前文件夹的上一级文件夹中 images 文件夹里的一个文件:

实例

<img src="../images/picture.jpg" alt="flower">

好习惯

使用相对路径是个好习惯(如果可能)。

如果使用了相对路径,那么您的网页就不会与当前的基准 URL 进行绑定。所有链接在您的电脑上 (localhost) 或未来的公共域中均可正常工作。

HTML 文件路径的更多相关文章

  1. Oracle数据库文件路径变更

    环境:RHEL 6.4 + Oracle 11.2.0.3 情景一:只是部分普通数据文件迁移,可以在线操作. 1.将对应表空间offline,移动数据文件到新路径 2.数据文件alter databa ...

  2. Excel公式 提取文件路径后缀

    我们在代码中获取一个文件路径的后缀,是一个很简单的事. 如C#中,可以通过new FileInfo(filePath).Extension,或者Path.GetExtension(filePath)获 ...

  3. IISExpress Log 文件路径

    问题 用VS做开发时经常用IISExpress测试web程序,那么在测试过程中生成的Log文件放在哪里了? 答案 情况1 默认情况下 applicationhost.config 文中定义了连个日志文 ...

  4. [LeetCode] Longest Absolute File Path 最长的绝对文件路径

    Suppose we abstract our file system by a string in the following manner: The string "dir\n\tsub ...

  5. 使用powershell批量添加Keil和IAR的头文件路径

    在Keil和IAR的工程中,为了使文件结构清晰,通常会设置很多的子文件夹,然后将头文件和源文件放在不同的子文件夹中,这样就需要手动添加这些头文件夹的路径.当工程结构非常复杂时,文件夹的数量就非常多,特 ...

  6. Yii2:避免文件路径暴漏,代理访问文件

    制作背景:公司要做第三方文件管理系统,客户有时候需要直接访问文件,但是我们又不想暴露文件路径,才有这代理访问 基本功能介绍:读取txt文档.读取图片,如果有需要,可以通过插件读取doc.pdf文档, ...

  7. php glob()函数实现目录文件遍历与寻找与模式匹配的文件路径

    采用PHP函数glob实现寻找与模式匹配的文件路径,主要讨论glob()函数的作用和用法,利用glob函数读取目录比其它的要快N倍,因为glob函数是内置函数处理起来自然要快. 一,函数原型 arra ...

  8. java 读文件路径问题

    文件路径:右键点击src新建Source Folder,创建结果与src目录同级. C:\Users\lenovo\workspace\timedTask\config\userinfo.proper ...

  9. 关于获取web应用的文件路径的注意事项

    今天在把数据写入文件时遇到了一个问题,指定的文件获取不到.一开始是这样的 URL url = XXX.class.getClassLoader().getResource(fileName);File ...

  10. java通过文件路径读取该路径下的所有文件并将其放入list中

    java通过文件路径读取该路径下的所有文件并将其放入list中   java中可以通过递归的方式获取指定路径下的所有文件并将其放入List集合中.假设指定路径为path,目标集合为fileList,遍 ...

随机推荐

  1. STT-MRMA技术优点

    到目前为止,设计人员可以使用的存储技术是易变的,这意味着在断电后,存储器中的数据内容会丢失.但是,随着Everspin Technologies推出256Mb STT-MRAM,系统现在可以拥有像DR ...

  2. JS 获取元素、修改元素/css样式/标签属性、简单事件、数据类型

    基本使用 写在Script 标签里 引入外部js文件:<script src=" "></script> console.log(" " ...

  3. SAP QM 主检验特性主数据关键字段解释

    SAP QM 主检验特性主数据关键字段解释 检验特征是QM模块中的一项重要主数据,可以说是QM检验业务的构成基础,它通过体现在Task list (检验任务清单)和/或material specifi ...

  4. mysql分表之水平分割

    一.背景 老大安排要对某张大容量表进行分割,根据年份分割成多张表. 二.水平分割 水平拆分是指数据表行的拆分,表的行数超过百万行时,就会变慢,这时可以把一张的表的数据拆成多张表来存放. 定义规则分表后 ...

  5. 新手Linux之路之Deepin

    用了很久的Window,心血来潮想换个系统,于是就开始踩坑Linux之路. 系统为deepin 首先基本的 设置root密码 $:sudo passwd root [sudo] password fo ...

  6. 物联网架构_对AWS的Greengrass的认识与理解

    物联网架构_对AWS的Greengrass的认识与理解 一,前言: 这段时间有许多的收获,分析,还有总结,其中包括新系统的设计与开发,以及其中新技术的踩坑等等等. 但是最近真的很忙,项目的推进,面试工 ...

  7. C# 多线程、异步、同步之间的联系与区别

    C# 多线程.异步.同步之间的联系与区别 假设这样一个例子: 我想炒五样菜,但是只有两个炉子可以用,只能同时炒两样. 炉子就是线程,那同步跟异步怎么解释比较好? 同时炒是不是算异步? 如果是的话,那什 ...

  8. 利用文件保存 Map 健值信息

    Map<String,MobileCard> cards = new HashMap<String,MobileCard>(); Map<String,List<C ...

  9. vue中计算属性的get与set方法

    计算属性get set方法 在vue的计算属性中,所定义的都是属性,可以直接调用 正常情况下,计算属性中的每一个属性对应的都是一个对象,对象中包括了set方法与get方法 computed:{ ful ...

  10. 从0系统学Android--3.1编写UI界面

    从0系统学Android--3.1编写UI界面 本系列文章目录:更多精品文章分类 本系列持续更新中.... 界面设计和功能开发同样重要,界面美观的应用程序不仅可以大大增加用户粘性,还能帮我们吸引到更多 ...