有没有简单的方法来设置渐变样式文本？

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;