CSS3可以添加文本漸變嗎？

Question

我正在尋找在文本中添加漸變。網隊有一個quick tips。但它只適用於webkit瀏覽器。由於這是相當老的帖子，我正在檢查是否有任何跨瀏覽器解決方案（忽略ie）。

我知道如何使用背景梯度圖像

Answer 1

我知道得到在Firefox這個工作是通過SVG，不幸是一個有點笨拙的唯一方法。最好的部分是應該在Opera和IE9中工作（未經測試）。如果doctype被聲明爲XHTML並作爲XML（ugh）提供服務，它將在Firefox 3.6中運行。

<svg height="200" width="500"> 
    <defs> 
    <linearGradient id="gradient" x1="0%" y1="0%" x2="0%" y2="100%"> 
     <stop offset="0%" style="stop-color:rgb(255,255,255); stop-opacity:1"/> 
     <stop offset="100%" style="stop-color:rgb(60,60,60); stop-opacity:1"/> 
    </linearGradient> 
    </defs> 
    <text x="0" y="150" font-family="Arial Black, Arial" font-size="55" fill="url(#gradient)" letter-spacing="-1" class="svg_text"> 
    NICE GRADIENT 
    </text> 
</svg> 

檢查出來上的jsfiddle http://jsfiddle.net/sHaWW/