Reputation: 12538
I am using Spring 3.0.7 for my web application. I want to load an image from my resource location in a CSS file like this:
.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:
<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!
Upvotes: 5
Views: 16063
Reputation: 16269
The CSS path is relative to the CSS document location:
.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 here and here!
Upvotes: 2
Reputation: 326
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')
.
Upvotes: 20