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

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

  • 网页
  • 图像
  • 样式表
  • 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. .NET Core使用RabbitMQ

    RabbitMQ简介 RabbitMQ是一个开源的,基于AMQP(Advanced Message Queuing Protocol)协议的完整的可复用的企业级消息队,RabbitMQ可以实现点对点, ...

  2. Blog 须知

    转载 转载需通过博主同意方可 代码格式 博主遵循 \(Google\) 代码格式,代码满足以下规范: 字符数 每行代码必需不超过 80 字符 缩进 缩进不使用制表符,而是 2 个空格缩进 函数 函数左 ...

  3. CAD绘图效率低?教你4个CAD绘图技巧,绘图效率提升十倍

    CAD绘图一直是一个谜一样的存在,说它简单吧,很多人都无法完全精通,说它难吧,很多人也都自学成才了. 如何学好CAD绘图是个难题,但是老话说的好,只要思想不滑坡,办法总比困难多,掌握以下这些CAD绘图 ...

  4. QT获取linux下的当前用户名

    故事背景:客户端启动的时候需要加载机器/home/xx/test.jpg的图片作为背景图,但是有的机器用户名叫AAA,有的机器名叫BBB,所以我需要获取当前用户的home目录 技术调研:QStanda ...

  5. 使用ReentrantLock

    /** * java.util.concurrent.locks包提供的ReentrantLock用于替代synchronized加锁* 因为synchronized是Java语言层面提供的语法,所以 ...

  6. vue组件常用声明方式

    一.前言 这是自己重新写的一个,感觉以前的太写了很多不必要的方式 实际当中基本不会用的 所以自己写了一个常用的组件什么方式 更加的通俗易懂 二.代码如下 <!DOCTYPE html> & ...

  7. Selenium 与自动化测试 —— 《Selenium 2 自动化测试实战》读书笔记

    背景 最近在弄 appium,然后顺便发现了 Selenium 框架和这本书,恰好这本书也介绍了一些软件测试&自动化测试的理论知识,遂拿过来学习学习.所以本文几乎没有实践内容,大多都是概念和工 ...

  8. tomcat的jsp页面超过65535,导致500报错

    错误信息 org.apache.jasper.JasperException: Unable to compile class for JSP: An error occurred at line: ...

  9. .NET Core AES-CCM&AES-GCM加密算法

    一. 前言 关于 CCM 以及 GCM 看此文( CCM和GCM )或者直接搜索网上资料. .NET Core 3.0 实现了对AES-GCM和AES-CCM加密的支持.这些算法既是带有关联数据的身份 ...

  10. 文件上传报错:Unknown: file created in the system's temporary directory

    nginx+php下文件上传成功,但会有错误提示如下: <b>Notice</b>:  Unknown: file created in the system's tempor ...