java Spring CSS 图像加载

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/10799736/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-31 02:37:23  来源:igfitidea点击:

Spring CSS image loading

javacssspringspring-mvc

提问by Bitmap

I am using Spring 3.0.7for my web application. I want to load an image from my resource location in a CSS file like this:

我的 Web 应用程序使用的是 Spring 3.0.7。我想在 CSS 文件中从我的资源位置加载图像,如下所示:

.tag {
    background: transparent url(/resources/img/bg.gif) no-repeat;
    background-position: 0 50%;
    padding-left: 50px
}

I can easily load my static resource in jsp file as shown below without any issues:

我可以轻松地在 jsp 文件中加载我的静态资源,如下所示,没有任何问题:

<c:url value="/resources/css/main.css" />

My static resource handler has been configured as shown below:

我的静态资源处理程序已配置如下:

<mvc:resources mapping="/resources/**" location="/web-resources/"/>

As said ealier, I can load resources in jsp files without an issue, but cannot get the image to load in my CSS. Can anyone help load the image in the CSS file!

如前所述,我可以毫无问题地在 jsp 文件中加载资源,但无法在我的 CSS 中加载图像。任何人都可以帮助在 CSS 文件中加载图像!

回答by zbrukas

If your folder tree is something like this:

如果您的文件夹树是这样的:

+resources 
 -css
   -main.css

 -img
  -lots_of_img.jpg

Then is easier just to url('../img/bg.gif').

然后就更容易了url('../img/bg.gif')

回答by Zuul

The CSS path is relative to the CSS document location:

CSS 路径是相对于 CSS 文档位置的:

.tag {
    background: transparent url("resources/img/bg.gif") no-repeat;
    background-position: 0 50%;
    padding-left: 50px
}

or

或者

.tag {
    background: transparent url("../resources/img/bg.gif") no-repeat;
    background-position: 0 50%;
    padding-left: 50px
}

or based on the structure logic

或基于结构逻辑

.tag {
    background: transparent url("../img/bg.gif") no-repeat;
    background-position: 0 50%;
    padding-left: 50px
}

It all depends on your directory structure!

这完全取决于您的目录结构!

You can read more about this hereand here!

您可以在此处此处阅读有关此内容的更多信息!