4

我试图让一些文本具有渐变色,但我不知道如何。我试图这样得到它:

渐变图像

我唯一尝试过的是-webkit-mask,但我无法让它按照我想要的方式工作。另一件事是-webkit-gradientcolor财产中-这可能吗?

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

4

1 回答 1

7

对于基于 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;
}

对于 IE 和其他:

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

于 2012-08-31T13:02:43.747 回答