CSS CSS根目录
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7037959/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS root directory
提问by AlexMorley-Finch
I have a style sheet where I include background images.
我有一个样式表，其中包含背景图像。
background: url(../Images/myImage.png);
problem is, pages from different directories use this css!
问题是，来自不同目录的页面使用这个 css！
My CSS files are in a CSS folder, images in an Image folder, and my html pages are in many different folders depending on their content and meaning to the website.
我的 CSS 文件在 CSS 文件夹中，图像在 Image 文件夹中，我的 html 页面位于许多不同的文件夹中，具体取决于它们的内容和对网站的意义。
All my pages inherit this css as it is the MAIN theme.
我所有的页面都继承了这个 css，因为它是主主题。
The path used in the above example is a relative path. And obviously, this path only works for some of the pages. ALL i need is to link the images in the css from the ROOT folder. Therefore every path is correct no matter where the file is in the folder structure!
上例中使用的路径是相对路径。显然，此路径仅适用于某些页面。我只需要从 ROOT 文件夹链接 css 中的图像。因此，无论文件在文件夹结构中的哪个位置，每个路径都是正确的！
I have tried:
我试过了：
~/Images/myImage.png
./Images/myImage.png
/Images/myImage.png
Images/myImages.png
I don't think a root folder selector exists... but I hope it does :/
我不认为根文件夹选择器存在......但我希望它存在：/
回答by genesis
/Images/myImage.png
this has to be in root of your domain/subdomain
这必须在您的域/子域的根目录中
http://website.to/Images/myImage.png
http://website.to/Images/myImage.png
and it will work
它会起作用
However, I think it would work like this, too
但是，我认为它也会像这样工作
- images
- yourimage.png
- styles
- style.css
- 图片
- 你的图像.png
- 样式
- 样式文件
style.css:
样式.css：
body{
background: url(../images/yourimage.png);
}
回答by S.Akruwala
click herefor good explaination!
单击此处以获得很好的解释！
All you need to know about relative file paths:
您需要了解的有关相对文件路径的所有信息：
Starting with "/"returns to the root directory and starts there
以“/”开头返回根目录并从那里开始
Starting with "../"moves one directory backward and starts there
以“../”开始向后移动一个目录并从那里开始
Starting with "../../"moves two directories backward and starts there (and so on...)
以“../../”开始向后移动两个目录并从那里开始（依此类推......）
To move forward, just start with the first subdirectory and keep moving forward
要前进，只需从第一个子目录开始并继续前进
回答by John F
I use a relative path solution,
我使用相对路径解决方案，
./../../../../../images/img.png
./../../../../../images/img.png
every ../ will take you one folder up towards the root. Hope this helps..
每个 ../ 都会带你一个文件夹到根目录。希望这可以帮助..
回答by KarenAnne
For example your directory is like this:
例如你的目录是这样的：
Desktop >
ProjectFolder >
index.html
css >
style.css
images >
img.png
You are at your style.css and you want to use img.png as a background-image, use this:
你在你的 style.css 并且你想使用 img.png 作为背景图像，使用这个：
url("../images/img.png")
Works for me!
为我工作！
回答by Yos
In the CSS all you have to do is put url(logical path to the image file)
在 CSS 中，你所要做的就是把 url(logical path to the image file)
回答by Aylian Craspa
This problem that the "../" means step up (parent folder) link "../images/img.png"will not work because when you are using ajax like data passing to the web site from the server.
这个“../”意味着加强（父文件夹）链接的问题"../images/img.png"将不起作用，因为当您使用ajax之类的数据从服务器传递到网站时。
What you have to do is point the image location to root with "./" then the second folder (in this case the second folder is "images")
您需要做的是使用“./”将图像位置指向根目录，然后指向第二个文件夹（在这种情况下，第二个文件夹是“images”）
url("./images/img.png")
if you have folders like this
如果你有这样的文件夹
then you use url("./content/images/img.png"), remember your image will not visible in the editor window but when it passed to the browser using ajax it will display.
然后你使用url("./content/images/img.png")，记住你的图像在编辑器窗口中是不可见的，但是当它使用 ajax 传递到浏览器时它会显示。
