在文本中包裹圖像/圖案

Question

我正試圖在HTML/CSS中實現此效果。

我知道梯度工作，但是這個確切的圖案是不可能創造與梯度。

有沒有人有一些解決方案，或者這只是根本不可能創建inHTML/CSS？ 在最後的手段，我會不幸地使用一個圖像。

謝謝

Answer 1

This blog post提供瞭如何與不支持它的瀏覽器曼妙回退，以實現這一目標。這是在支持webkit的瀏覽器上實現它的CSS。

h1 { 
    color: fallbackColor; 
    background: url(path/to/image.jpg) no-repeat; 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
}