在Firefox上的文本渐变

Question

我创建了一个适用于chrome的文本渐变，我一直试图使用-moz-在firefox中以相同的方式显示文本，但没有成功。

有没有办法为firefox创建同样的效果？

这是css：

body h3 {
  text-align: center;
  text-transform: uppercase;
  font-size: 40px;
  font-weight: 600;
  background: -webkit-linear-gradient(top, #48e0ff, #ffffff);
  background: linear-gradient(top, #48e0ff, #ffffff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

Answer 1

不幸的是，虽然background-clip是有效的CSS3属性，但文本值是非标准的。非webkit浏览器的常见解决方法是使用SVG。

我找到了一个用于处理这个跨浏览器的jQuery插件。虽然看起来确实有点沉重。

Demo Github