Question

我的CSS文件位于：

项目/网络/支持/样式/ file.css

我的图片位于：

项目/网络/图像/ image.png

我想在CSS文件中使用此图片。

我试过了：

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");

但是。我没有在我的页面中显示此图像。

在css文件中指定图像文件路径的正确方法是什么？

Answer 1

你的css在这里：Project / Web / Support / Styles / file.css

1次../表示项目/网络/支持和2次../即../../表示项目/网站

尝试：

background-image: url('../../images/image.png');

Answer 2

有两种基本方法：

url(../../images/image.png)

或

url(/Web/images/image.png)

我更喜欢后者，因为它更容易使用并且可以在网站的所有位置使用（对内联图像路径也很有用）。

请注意，我不会对文件夹进行如此深的嵌套。正如你所发现的那样，这似乎是不必要的，让生活变得有点困难。

Answer 3

使用以下内容。

background-image: url("././images/image.png");

这应该有用。

Answer 4

您需要从css文件中获取2个文件夹。

<强>尝试：

background-image: url("../../images/image.png");

Answer 5

您还可以按照以下示例添加内嵌CSS，以将图像添加为背景

<div class="item active" style="background-image: url(../../foo.png);">

Answer 6

解决方案（http://expressjs.com/en/starter/static-files.html）。

一旦完成此图像文件夹就不再需要了。只是

background-image：url（＆＃34; / image.png＆＃34;）;

carpera图片已经在静态文件中

如何在CSS中给出背景图像路径？

6 个答案: