Html 如何在 CSS 中给出背景图片路径？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20047364/
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
How to give the background-image path in CSS?
提问by Jobin
My CSS file is in :
我的 CSS 文件在：
Project/Web/Support/Styles/file.css
项目/网络/支持/样式/file.css
My image is in :
我的形象在：
Project/Web/images/image.png
项目/网络/图像/image.png
I want this image in my CSS file.
我想在我的 CSS 文件中使用这个图像。
I have tried :
我试过了 ：
1) background-image: url(/images/image.png);
2) background-image: url('/images/image.png');
3) background-image: url("/images/image.png");
4) background-image: url(../images/image.png);
5) background-image: url('../images/image.png');
6) background-image: url("../images/image.png");
But. i'm not getting this image in my page.
但。我没有在我的页面中看到这张图片。
What is the correct way to specify the path of image file in the css file ?
在 css 文件中指定图像文件路径的正确方法是什么？
回答by Hiral
Your css is here: Project/Web/Support/Styles/file.css
你的 css 在这里：Project/Web/Support/Styles/file.css
1 time ../means Project/Web/Support and 2 times ../ i.e. ../../means Project/Web
1 次../表示 Project/Web/Support，2 次 ../ 即../../表示 Project/Web
Try:
尝试：
background-image: url('../../images/image.png');
回答by ralph.m
There are two basic ways:
有两种基本方式：
url(../../images/image.png)
or
或者
url(/Web/images/image.png)
I prefer the latter, as it's easier to work with and works from all locations in the site (so useful for inline image paths too).
我更喜欢后者，因为它更容易在站点的所有位置使用和工作（对于内嵌图像路径也非常有用）。
Mind you, I wouldn't do so much deep nesting of folders. It seems unnecessary and makes life a bit difficult, as you've found.
请注意，我不会对文件夹进行如此深的嵌套。正如您所发现的，这似乎没有必要，而且让生活变得有些困难。
回答by Nitesh
Use the below.
使用下面的。
background-image: url("././images/image.png");
This shall work.
这将起作用。
回答by UnderTheSea
You need to get 2 folders back from your css file.
您需要从 css 文件中取回 2 个文件夹。
Try:
尝试：
background-image: url("../../images/image.png");
回答by Yogesh
you can also add inline css for adding image as a background as per below example
您还可以按照以下示例添加内联 css 以将图像添加为背景
<div class="item active" style="background-image: url(../../foo.png);">
回答by lypef
The solution (http://expressjs.com/en/starter/static-files.html).
解决方案（http://expressjs.com/en/starter/static-files.html）。
once done this the image folder no longer shalt put it. only be
完成此操作后，图像文件夹将不再放置。只是
background-image: url ( "/ image.png");
背景图片：网址（“/ image.png”）；
carpera that the image is already in the static files
carpera 图像已经在静态文件中
