使用百里香葉設置CSS樣式屬性

Question

如何使用百里香葉解析後的url設置樣式標籤的背景屬性。

我

<div style="background:url('<url-to-image>')"></div> 

是否有一個相當於用於設置thymeleaf樣式屬性<img th:src="${@/<path-to-image>}">。

Answer 1

你可以做到這一點，如果你使用th:style設置你的風格屬性：

<div th:style="'background:url(' + @{/<path-to-image>} + ');'"></div> 

檢查this線程thymeleaf論壇。

Answer 2

我希望它能幫助別人。

請確保您的圖像尺寸比屏幕尺寸小，以像素爲單位。否則，「背景」和「背景圖像」都不適合我。

Leandro的語法工作正常。考慮使用這一個以及（「背景圖像」而不是「背景」）

<div th:style="'background-image:url(' + @{/images/R1.jpg} + ');'"> 

這一個伸出，而不是重複它，如果圖像是較小的（不需要到狀態「無重複」）的圖像