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

有可能。您只需要将背景图像与背景剪辑：文本组合：请参阅此处的this most excellent example。

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

Answer 2

除非使用图像覆盖字体，否则纯CSS无法实现： http://www.webdesignerwall.com/tutorials/css-gradient-text-effect/ 您可以使用相同的技术，但在覆盖元素中使用颜色到透明渐变。

这是一个纯CSS和一个附加元素的示例：http://jsfiddle.net/Lub7z/

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

2 个答案: