HTML 认知-15-相对路径-同级和下级

最新推荐文章于 2025-02-09 20:45:25 发布

原创最新推荐文章于 2025-02-09 20:45:25 发布

· 1.7k 阅读

1 ·

版权

文章标签：

#html #前端 #vscode

本文介绍了HTML中相对路径的概念，包括同级目录和下级目录的使用。同级目录是指当前文件与目标文件位于同一层级，只需直接写目标文件名。下级目录则需要指定目标所在的子目录，通过文件夹名加'/'进入，再给出目标文件名。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

3.2.3相对路径（常用）

★概念普及：

· 当前文件：当前的html网页

· 目标文件：要找到的图片

★相对路径：从当前文件开始出发找目标文件的过程

★相对路径分类：

· 同级目录

· 下级目录

· 上级目录

3.2.4相对路径-同级目录

★同级目录：当前文件和目标文件在同一目录中

★类似于：我（当前文件）和你（目标文件）都在大厅（一个文件夹中）

· 生活中：两个人独处一室，我想找你，直接喊名字即可！

★代码步骤：直接写目标文件的名字即可

· 方法一：<img> src="目标图片.gif"> · 方法二：<img> src="./目标图片.gif">

3.2.5相对路径-下级目录

★类似于：我在大厅，你累了去卧室休息了，我现在要找到你！

1.先知道你去了哪一个房间→房间名：卧室

2.进入这个房间→进入

3.此时又独处一室→直接喊你名字

★代码步骤：

1.先知道在哪个文件夹里面→文件夹名字

2.进入这个文件夹→/

3.此时看到目标文件直接喊他→直接写目标文件名字

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

Keep learning（Poker）

关注关注

2
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
打赏
打赏
打赏举报

举报

从零构建知识图谱(技术、方法与案例)-第二章：知识图谱技术体系

u013250861的博客

04-30

2167

当前，人工智能技术的发展速度之快已经超出了所有人的想象，以至于总会有人不断将现有人工智能的表现与人类相比较。然而，在经过不同层面的对比之后，不难得出一个结论：尽管目前人工智能技术在一些特定任务上有比较好的表现，但在一些开放性的任务上往往不尽如人意。换言之，利用深度学习和大数据，目前的人工智能系统足够“聪明”，虽可以在计算密集型任务上超越人类，却远未达到“有学识”的程度，无法和人一样进行复杂的推理和联想等。而知识图谱被认为是让人工智能系统做到“有学识”的关键，它通过诸如 RDF、图形式等存储各种各样的结构化知

02. HTML - 标签学习（1）

蓝胖子 (*^_^*)的博客

08-06

454

排版标签标题标签标题标签：用来突出显示文章主题代码：h系列标签 <body> 普通的文字 <h1>一级标题</h1> <h2>二级标题</h2> <h3>三级标题</h3> <h4>四级标题</h4> <h5>五级标题</h5> <h6>六级标题</h4> </body> 语义：1.

参与评论您还未登录，请先登录后发表或查看评论

让学习成为一种习惯 ( 韩曙亮の技术博客 )

02-06

4392

一、文件路径、 1、绝对路径、 2、相对路径 ( 同级目录访问 | 下级目录访问 | 上级目录访问 )

相对路径（下级，同级）

Sweet_Jan的博客

11-03

679

HTML中的相对路径（下级，同级）

关于同级路径问题

dongfangyueguang的博客

06-27

1389

表示同级目录的有./，也可以不写，主要是./表示兼容性好

当前目录的相对路径和上下级目录怎么表示

weixin_53999754的博客

03-20

806

当前目录的相对路径和上下级目录怎么表示

相对路径，绝对路径，文件路径

shldwb的博客

04-18

2418

前端的路径问题指的是在前端开发中，如何正确引用和使用文件的路径。在前端开发中，常见的文件包括 HTML、CSS、JavaScript、图片等。在 HTML 文件中，可以使用相对路径或绝对路径来引用其他文件。相对路径是相对于当前文件的位置来确定引用文件的位置，而绝对路径则是根据文件系统的根目录来确定引用文件的位置。同级目录、下一级目录、上一级目录、

HTML+CSS学习知识整理-常温故知新

偷吃藏在半岛铁盒里的麦芽糖

06-30

164

HTML(Hyper Text Markup Language)中文译为:超文本标记语言。 ➢ 专门用于网页开发的语言，主要通过HTML标签对网页中的文本、图片、音频、视频等内容进行描述。HTML骨架结构由哪些标签组成? • html标签:网页的整体 • head标签:网页的头部 • body标签:网页的身体 • title标签:网页的标题 1.4 语法规范 1.4.1 HTML的注释注释的作用: • 为代码添加的具有解释性、描述性的信息，主要用来帮助开发人员理解代码 • 浏览器执行代码时会忽略所有的注释

HTML5

weixin_52047874的博客

02-09

925

结构说明：1.标签由<、>、/、英文单词或字母组成。并且把标签中<>包括起来的英文单词或字母称为标签名2.常见标签由两部分组成，我们称之为：双标签。前部分叫开始标签，后部分叫结束标签，两部分之间包裹内容3.少数标签由一部分组成，我们称之为：单标签。自成一体，无法包裹内容。如：<br>、<hr>父子关系(嵌套关系)<head></head>兄弟关系(并列关系)场景：在网页的底部导航中通常会使用自定义列表实现。标签组成：显示特点：dd前会默认显示缩进效果。

01.HTML和CSS基础知识总结（内附思维导图）

weixin_67140731的博客

04-02

1258

前端HTML和CSS基础知识总结，内附思维导图和开发软件的快捷键

【HTML】掌握 HTML 5 标签搭建页面结构

ITLearnNote—-聚焦互联网的技术革新

04-19

897

HTML基础介绍

相对路径详解

Vincent_Zhang233的博客

09-07

791

关于相对路径的知识点

了解相对路径与绝对路径

weixin_46708745的博客

08-11

879

今天聊一聊相对路径，与绝对路径的问题。 相对路径（Relative Path）：硬盘中，指某个文件的路径和别的文件的路径关系，通常从别的文件位置开始到目标文件的位置。绝对路径（Absolute Path）：文件在硬盘中真正存在的绝对位置，通常是从盘符开始的路径，直接到达目标位置。为什么相对路径用的多？因为绝对路径不利于搜索引擎表现，相对路径在搜索引擎中表现良好，所以一般使用相对路径较多！如何表示相对路径和绝对路径？首先需要我们知道，之前Unix与Linux系统使用 “/” 来分割路径，Windo

html设置同级目录同一目录,nuxt.js如何实现同级目录下建多个动态路由，并将链接设置.html后缀...

weixin_31075273的博客

06-18

717

nuxt.js中如果在同级目录中建两个_xxxx.vue的动态路由文件，那么页面跳转始终是跳的一个页面，如何解决这个问题呢？下面举个栗子：第一步：新建两个页面文件第二步：在nuxt.config.js文件中配置两个页面的动态路由router: {extendRoutes(routes, resolve) {routes.push({name: "pageA",path: "/strA-:id",c...

相对路径书写方式

weixin_44136242的博客

07-22

1万+

相对路径的书写方式： (1) 与“当前文件”同级，可以使用“./”，其中“./”可以省略。 (2) 与“当前文件”不同级，书写方式如下： a) 当目标文件在“当前文件”上一级时，可以使用“. ./”，每一个“. ./”代表往上找一级。 b) 当目标文件在“当前文件”所在级别的下面时，可以从当前级别往下查找。eg：相当于绝对路径的写法<img src="source/img/1.png">或者<img src="./source/img/1.png"> 注意： 1、项..

【前端】HTML认知

Zh0uKal1的博客

11-28

1119

前端，HTML认知

HTML中相对路径和绝对路径的使用：

weixin_45376220的博客

07-23

531

相对路径：(用一个hello.jpg图片和一个html文件为例) 同级相对路径:图片和html文件在同一目录在html中引入图片:img src=“hello.jpg”/> 下一级相对路径:图片所在的文件夹(img)和html文件在同一目录在html中引入图片:img src=“img/hello.jpg”/> 上一级相对路径:html文件所在的文件夹和图片在同一目录在html中...

路径/ ./ ../的区别

肖肖肖丽珠的博客

09-19

7027

/ 网站根路径 ./ 当前路径 ../ 上一级路径 ../../ 上两级路径例如：本地静态网站 index页面地址 127.0.0.1/bootstrap_test/index.html在这里页面里面引入css和js路径应该怎么写呢? 1、 <link href="css/bootstrap.min.css" rel="stylesheet"> 实际请...

html中相对路径怎么写,什么是相对路径？相对路径的具体写法和用法

最新发布

03-09

<think>好的，我现在需要回答用户关于绝对路径和相对路径的区别及应用场景的问题。首先，我得回顾一下已有的引用内容，确保回答准确。根据引用[1]，绝对路径是从根目录开始的完整路径，而相对路径是相对于当前文件的路径。引用[4]提到它们的相同之处在于都是引用资源的方法，不同点在于绝对路径更精确但不易维护，相对路径更灵活。引用[5]详细说明了前端中绝对路径的例子，比如完整的URL，而相对路径使用./或../来表示层级关系。接下来，我需要整理两者的区别。绝对路径适合外部资源或固定位置，而相对路径适合项目内部资源，方便整体迁移。应用场景方面，绝对路径可能用于图片、链接外部资源，相对路径用于内部文件结构，如CSS、JS文件的引用。然后，用户可能需要了解何时选择哪种路径。比如，团队协作时用相对路径更合适，避免路径错误。而绝对路径在需要明确指定位置时使用，比如CDN资源。最后，生成相关问题需要考虑用户可能想深入的方向，比如如何转换路径、常见错误处理等。需要确保问题覆盖使用场景、优缺点比较和实际例子。</think>### 绝对路径与相对路径的区别和应用场景 #### 1. **基本概念** - **绝对路径**：从系统根目录（如 `C:\`）或网络根目录（如 `http://`）开始的完整路径。例如： - 本地文件：`C:/project/images/logo.png` - 网络资源：`https://example.com/css/style.css`[^1][^5]。 - **相对路径**：基于当前文件位置的路径，使用符号表示层级关系： - `./` 表示当前目录（可省略），如 `images/logo.png` - `../` 表示上级目录，如 `../scripts/app.js`[^5][^4]。 #### 2. **核心区别** | **特性** | **绝对路径** | **相对路径** | |----------------|---------------------------|---------------------------| | **精确性** | 唯一且固定[^3] | 依赖当前位置[^4] | | **维护性** | 路径变动需全局修改 | 文件移动时路径自动适应 | | **适用场景** | 外部资源引用（如CDN） | 项目内部资源引用 | #### 3. **应用场景** - **绝对路径**： - 引用外部资源（如第三方库、图片URL）[^5] - 需要明确唯一性的场景（如服务器配置文件）。 - **相对路径**： - 项目内部文件引用（如HTML引入同级CSS/JS）[^5] - 团队协作时避免路径冲突 - 示例： ```html  <link rel="stylesheet" href="../styles/main.css"> ``` #### 4. **选择建议** - 优先用**相对路径**：提升代码可移植性，减少迁移成本[^4]。 - 必要时用**绝对路径**：资源位置固定或跨域访问时[^3]。 ---