我在{root} / styles中存储样式表,而在{root} / images中存储图像用于网站。 如何在样式表中给出路径以查看指定图像的images目录?
e.g。在background-image: url('/images/bg.png');
答案 0 :(得分:164)
使用..
表示父目录:
background-image: url('../images/bg.png');
答案 1 :(得分:47)
使用../
:
background-image: url('../images/bg.png');
您可以根据需要随时使用,例如../../images/
或甚至在不同的位置,例如../images/../images/../images/
(当然与../images/
相同)
答案 2 :(得分:36)
以下是您需要了解的相关文件路径:
从 /
开始,返回根目录并从那里开始
从 ../
开始向后移动一个目录并从那里开始
从开始../../
向后移动两个目录并从那里开始(依此类推......)
要继续前进,只需从第一个子目录开始,然后继续前进。
点击here了解详情!
答案 3 :(得分:8)
在Chrome中,当您从某个HTTP服务器加载网站时,绝对路径(例如/images/sth.png
)和某些上级目录的相对路径(例如../images/sth.png
)都可以正常工作。
但是!
当您从本地文件系统加载(在Chrome!中)HTML文档时,您无法访问当前目录上方的目录。即您无法访问../something/something.sth
并将相对路径更改为绝对路径或其他任何内容都无济于事。
答案 4 :(得分:1)
如果您将样式表/图像存储在一个文件夹中,以便多个网站可以使用它们,或者您想在同一服务器上的另一个站点上重复使用相同的文件,我发现我的浏览器/ Apache不允许我转到网站根URL上方的任何父文件夹。出于安全原因,这似乎很明显-除了指定的Web文件夹之外,其他人都不能在服务器上浏览任何地方。
例如。不起作用:www.mywebsite.com /../ images
作为一种解决方法,我使用符号链接:
转到www.mywebsite.com的目录 运行命令ln -s ../images images
现在www.mywebsite.com/images将指向www.mywebsite.com /../ images
答案 5 :(得分:0)
假设您具有以下文件结构:
-css
--index.css
-images
--image1.png
--image2.png
--image3.png
例如,在CSS中,您可以使用image1
行访问../images/image1.png
。
注意:如果您使用的是Chrome,它可能无法正常工作,并且会出现一个错误,提示找不到文件。我遇到了同样的问题,所以我只是从chrome中删除了整个缓存历史记录,并且工作正常。