CSS中URL路径

最新推荐文章于 2025-05-29 21:15:53 发布

weixin_30765505

最新推荐文章于 2025-05-29 21:15:53 发布

阅读量933

点赞数 1

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/princeding/p/4395784.html

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

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

一直没有效果，后来才发现是绝对路径，相对路径搞错了。url(images/sort.png)表示的是当前文件夹下的images文件夹下的sort.png图片，因为CSS文件位于/Content文件夹，所以系统就去/Content/images下寻找sort.png图片，而此时图片位于/images中，当然就找不到了。

修复方法：

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

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

以下是百度的内容：

"." 代表当前所在目录，相对路径。如:<a href="./abc">文本</a>或<img src="./abc" />；
".." 代表上一层目录，相对路径。如:<a href="../abc">文本</a>或<img src="../abc"/>；
"../../" 代表的是上一层目录的上一层目录，相对路径。 如:<img src="../../abc" />；
"/" 代表根目录,绝对路径。

转载于:https://www.cnblogs.com/princeding/p/4395784.html