有沒有簡單的方法來設置漸變樣式文本？

Question

有可能風格的背景，像梯度： background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(100%,#cccccc));

有沒有一種辦法風格的文本與漸變我一直在尋找像某事： color-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(100%,#cccccc));但無法找到任何簡單。

感謝您的幫助。

Answer 1

它不可能用純CSS，除非你使用圖像覆蓋字體： http://www.webdesignerwall.com/tutorials/css-gradient-text-effect/ 你可以使用相同的技術，但在覆蓋元件使用顏色到透明的漸變。

這裏是用純CSS和附加元素的示例：http://jsfiddle.net/Lub7z/

Answer 2

是可能的。您只需將背景圖像與背景剪輯合併：text：請參閱this most excellent example。

background: url(/bgclip/img/paint.png) repeat, white; 
-webkit-text-fill-color: transparent; 
-webkit-background-clip: text;