css中URL路径相关介绍

如果你在引用文件时(如加入超链接，或者插入图片等)，使用了错误的文件路径，就会导致引用失效(无法浏览链接文件，或无法显示插入的图片等)。本文就来为大家介绍一些css url相关知识。

项目中，为a标签添加背景，老是没效果（VS2013中相关文件的位置：CSS文件位于/Content中，图片位于/images中）

为a标签添加背景的CSS代码为：background:url(images/sort.png-600) no-repeat 0 3px;

一直没有效果，后来才发现是绝对路径，相对路径搞错了。

url(images/sort.png-600)表示的是当前文件夹下的images文件夹下的sort.png-600图片，因为CSS文件位于/Content文件夹，所以系统就去/Content/images下寻找sort.png-600图片，而此时图片位于/images中，当然就找不到了。

修复方法：

1. 绝对路径: url(/images/sort.png-600) 表示到根目录下寻找images文件夹里面的sort.png-600图片

2. 相对路径：url(../images/sort.png-600) 表示从当前目录返回到上一层目录，即/目录，然后再查找/目录下的images目录里面的sort.png-600图片

以下是百度的内容：

"." 代表当前所在目录，相对路径。如:

<a href="./abc">文本</a>或<img src="./abc" />；

".." 代表上一层目录，相对路径。如:

<a href="../abc">文本</a>

或

<img src="../abc"/>；

"../../" 代表的是上一层目录的上一层目录，相对路径。如:

<img src="../../abc" />；

"/" 代表根目录,绝对路径。