AEM6 - 圖像組件 - 我無法將圖像渲染爲背景

Question

我正在使用吊索組件/ libs/wcm/foundation/components/image。

我需要使用渲染圖像作爲CSS背景。

<img src="${image.src} /> -> OK: works 

<div style="background-image: url('${image.src}')">my text</div> -> KO: does not work. 

結果是<div style="background-image: url('')">my text</div>

我嘗試了在Chrome，FF和IE。

任何人都可以幫我解決這個問題嗎？

感謝

Answer 1

請試試這個：

style="background-image:url('${image.src @ context='unsafe'}')" 

Answer 2

悅目自動脫值，以防止跨站腳本問題，做的顯示環境時指定。對於CSS字符串，請使用顯示上下文styleString，以便編碼會突破字符串的字符。

<div style="background-image: url('${image.src @ context='styleString'}')">my text</div> 

有關顯示上下文的詳細信息，請參閱Sightly docs