文件资源路径（相对路径和绝对路径）
当我们使用img标签显示图片的时候，需要指定图片的资源路径，比如:
<img src="data:images/logo.png">
这里的src属性就是设置图片的资源路径的，资源路径可以分为相对路径和绝对路径。
1. 相对路径
从当前操作 html 的文档所在目录算起的路径叫做相对路径
示例代码:
<!-- 相对路径方式1 -->
<img src="./images/logo.png">
<!-- 相对路径方式2 -->
<img src="data:images/logo.png">
【./是当前，可以省略】
| 路径分类 | 符号 | 说明 |
|---|---|---|
| 同一级路径 | 只需输入图像文件的名称即可，如<img src="baidu.gif" />。 | |
| 下一级路径 | “/” | 图像文件位于HTML文件同级文件夹下（例如文件夹名称为：images） 如<img src="data:images/baidu.gif" />。 |
| 上一级路径 | “../” | 在文件名之前加入“../” ，如果是上两级，则需要使用 “../ ../”，以此类推， 如<img src="../baidu.gif" />。 |
2. 绝对路径
从根目录算起的路径叫做绝对路径，Windows 的根目录是指定的盘符，mac OS 和Linux 是/
示例代码:
<!-- 绝对路径 -->
<img src="/Users/apple/Desktop/demo/hello/images/logo.png">
<img src="C:\demo\images\001.jpg">
提示:
一般都会使用相对路径，绝对路径的操作在其它电脑上打开会有可能出现资源文件找不到的问题
注意：它的写法 特别是符号 \ 并不是 相对路径的 /
3. 小结
- 相对路径和绝对路径是 html 标签使用资源文件的两种方式，一般使用相对路径。
- 相对路径是从当前操作的 html 文档所在目录算起的路径
- 绝对 路径是从根目录算起的路径
文件资源路径（相对路径和绝对路径）相关推荐
- 访问tomcat服务器文件路径,外置tomcat映射服务器路径以及springboot内置tomcat映射路径配置...
外置tomcat映射路径 在tomcat里的conf下的server.xml里Host标签下加入 其中的docBase就是磁盘映射路径,path为访问路径,比如localhost:8080/repor ...
- java查找文件路径_如何查找java路径？
展开全部 Java的路径问题,非常难搞.最近的工作涉及到创建和读取文件的工作,这里我就给大家彻底得解决e69da5e6ba9062616964757a686964616f31333365633838J ...
- 解决：利用IDEA的右上角图标打开jsp文件，在浏览器中打开的是“本机文件路径”，而不是“http路径”问题
解决:利用IDEA的右上角图标打开jsp文件,在浏览器中打开的是"本机文件路径",而不是"http路径"问题 一·问题描述: 二·错误原因: 三·解决方法: 方 ...
- 文件路径 (/mnt/sdcard/...) 、Uri路径（content://media/external/...）
一.URI 通用资源标志符(Universal Resource Identifier, 简称"URI"). Uri代表要操作的数据,Android上可用的每种资源 - 图像.视频 ...
- python3查找文件中指定字符串_Python3在指定路径下递归定位文件中出现的字符串...
[本文出自天外归云的博客园] 脚本功能:在指定的路径下递归搜索,找出指定字符串在文件中出现的位置(行信息). 用到的python特性: 代码如下: import os import sys __all ...
- Spring boot 默认静态资源路径与手动配置访问路径的方法
这篇文章主要介绍了Spring boot 默认静态资源路径与手动配置访问路径的方法,非常不错,具有参考借鉴价值,需要的朋友可以参考下 在application.propertis中配置 ##端口号 s ...
- ios开发之plist 的文件的读写以及沙盒容器路径打印
ios开发之plist 的文件的读写以及沙盒容器路径打印 核心代码在这里 // // ViewController.m // 21-plist存储和沙盒路径 // // Created by 鲁军 o ...
- file相对路径java_浅谈java 中文件的读取File、以及相对路径的问题
一.对于java项目中文件的读取 1.使用system 或是 系统的properties对象 ①直接是使用 string relativelypath=system.getproperty(" ...
- python import sql脚本_13-模块介绍-import两种方式-py文件的两种用途-模块搜索路径-项目开发的目录规范...
1.模块的介绍与使用模块import 1.1.模块的介绍 1.1.1.什么是模块? 模块就是一组功能的集合体,我们的程序可以导入模块来复用模块里的功能.在python中,模块的使用方式都是一样的,但其 ...
最新文章
- linux内核更新/修补程序,Ubuntu 18.04.3 LTS无需重启即可轻松修补Linux内核
- 美团高德并不是解决快车问题的灵药，烧完钱之后只会产生新的滴滴
- c语言虚函数是什么,C语言中什么函数不能声明为虚函数？
- linux 编译内核几个常见问题解决方法
- session和cookie到底有什么联系？这一篇文章给你分析的明明白白~
- 软件史上最伟大的十大程序员(图文）
- 解决hive交互模式退格键乱码
- oracle create tablespace、user and grant
- delphi query 存储为dbf_Delphi 代码审计项目实战 1
- 【LeetCode】剑指 Offer 25. 合并两个排序的链表
- 《http权威指南》阅读笔记（六）
- php 汇率接口,PHP 对交易对汇率 转换
- Transformer 中 Decoder 结构解读_by 弘毅
- Windows 10打开蓝牙已关闭解决方法
- 数据结构各结构特点（数组、链表、栈、队列、树）
- 机器学习之为什么要数据预处理？如何预处理数据？
- 分享一篇写的非常好的文章《如何掌握企业级技术和项目经验》，非常值得一看！
- FFMpeg打开文件报错：Invalida data found when processing input
- 尚书视频群活动:投资分析师笔试题
- 活动回顾｜图扑软件亮相核电数字化技术与应用大会