Ustawianie atrybutów stylu CSS z thymeleaf

Question

Jak ustawić właściwość tła znacznika stylu za pomocą rozwiązanego adresu URL.

mam

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

Czy istnieje <img th:src="${@/<path-to-image>}"> równoważne do ustawiania atrybutów stylu w thymeleaf.

Answer 1

Można to osiągnąć, jeśli używasz th:style ustawić atrybut stylu:

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

Sprawdź this wątek na thymeleaf forum.

Answer 2

Mam nadzieję, że komuś to pomoże.

Upewnij się, że ROZMIAR OBRAZU jest MNIEJSZY niż rozmiar ekranu w pikselach. W przeciwnym razie ani "tło", ani "obraz tła" nie działałyby dla mnie.

Składnia Leandro działa dobrze. Zastanów się nad wykorzystaniem tego jednego, jak również („background-image” zamiast „background”)

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

Ten wyciąga obraz zamiast powtarzać, jeśli obraz jest mniejszy (nie trzeba stwierdzić „no-repeat”)