43 lines
1.4 KiB
Markdown
43 lines
1.4 KiB
Markdown
---
|
||
title: 相对地址与绝对地址
|
||
date: 2022-01-08 15:25:42
|
||
tags: [HTML]
|
||
categories: [HTML]
|
||
author: Anges黎梦
|
||
---
|
||
## 引入链接/文件
|
||
|
||
网页上引入或链接到外部文件，需要定义文件的地址，常见引入或链接外部文件包括以下几种：
|
||
|
||
```html
|
||
<!-- 引入外部图片 -->
|
||
<img src="images/001.jpg" alt="图片" />
|
||
<!-- 链接到另外一个网页 -->
|
||
<a href="002.html">链接到网页2</a>
|
||
<!-- 外链一个css文件 -->
|
||
<link rel="stylesheet" type="text/css" href="css/main.css" />
|
||
<!-- 外链一个js文件 -->
|
||
<script type="text/javascript" src="js/jquery.js"></script>
|
||
```
|
||
|
||
## 地址分类
|
||
> 这些地址分为相对地址和绝对地址:
|
||
|
||
### 相对地址
|
||
|
||
相对于引用文件本身去定位被引用的文件地址，以上的例子都是相对地址，相对地址的定义技巧：
|
||
|
||
- “ ./ ” 表示当前文件所在目录下，比如：“./pic.jpg” 表示当前目录下的pic.jpg的图片，这个使用时可以省略。
|
||
|
||
- “ ../ ” 表示当前文件所在目录下的上一级目录，比如：“../images/pic.jpg” 表示当前目录下的上一级目录下的 images文件夹中的pic.jpg的图片。
|
||
|
||
### 绝对地址
|
||
|
||
相对于磁盘的位置去定位文件的地址，
|
||
|
||
比如：
|
||
|
||
```html
|
||
<img src="C:\course5\03day\images\001.jpg" alt="图片" />
|
||
```
|
||
绝对地址在整体文件迁移时会因为磁盘和顶层目录的改变而找不到文件，相对地址就没有这个问题。 |