CSS:渐变文字颜色?

cal*_*rae 3 css gradient mask

我试图让一些文字有渐变色,但我不知道如何.我试着这样做:

渐变图像

我唯一尝试过的是-webkit-mask,但是我无法按照自己的意愿行事.另一件事是-webkit-gradientcolor财产 - 可能吗?

跨浏览器兼容性相当重要,但不是世界末日.我更喜欢IE中的文本是纯色而不是将整个事物转换为图像(这里有相当多的文本,其中一些是动态的).

Rya*_*ugh 6

对于基于webkit的浏览器(Chrome和Safari):

.text {
  font-size: 20px;
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#111));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
Run Code Online (Sandbox Code Playgroud)

对于IE和其他人:

http://www.webdesignerwall.com/demo/css-gradient-text/