Thymeleaf .css文件中的URL表达式 [英] Thymeleaf URL expression in .css file
问题描述
我使用Spring MVC和Thymeleaf视图引擎。我有一个外部 style.css 文件与我的页面的CSS。在CSS文件中，我要引用相对图片网址。
这是我的 style.css 文件：
.background {
width：100％;
background-image：url（'/ path / to / image / bg.png'）;
}
上述尝试访问具有以下URL的图像，存在：
http：//localhost/path/to/image/bg.png
我的真实形象是：
http：//localhost/myapp/path/to/image/bg.png
此StackOverflow问题对于我的内嵌CSS问题的答案：
I'm using Spring MVC and the Thymeleaf view engine. I have an external style.css file with the CSS for my page. In the CSS file, I want to refer to a relative image URL.
This is my style.css file:
.background { width: 100%; background-image: url('/path/to/image/bg.png'); }The above tries to access an image with the following URL, which doesn't exist:
http://localhost/path/to/image/bg.pngMy real image is at:
http://localhost/myapp/path/to/image/bg.pngThis StackOverflow question gives the answer to my question for inline CSS: How to set background url for css files in thymeleaf?
But how do I do this for an external .css file?
解决方案Put all your images folder structure with images
path/to/image/bg.pnginside theimagesfolder underresources/static. Then refer to it in CSS as:.background { width: 100%; background-image: url('..images/path/to/image/bg.png'); }And then you can use this CSS in your templates as:
<head> <link rel="stylesheet" media="screen" th:href="@{/css/application.css}"/> </head>Your files structure should look like this:
这篇关于Thymeleaf .css文件中的URL表达式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
