有没有一种简单的方法来设置带有渐变的文本样式?
可以使用渐变来设置背景样式,例如: background-image: -webkit-gradient(线性, 左上, 左下, color-stop(0%,#eeeeee), color-stop(100%,#cccccc));
有吗用渐变设置文本样式的方法?我一直在寻找类似的东西: color-image: -webkit-gradient(线性, 左上, 左下, color-stop(0%,#eeeeee), color-stop(100%,#cccccc));
但是不是'找不到任何简单的东西。
感谢您的帮助。
it is possible to style a background with gradients like:background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(100%,#cccccc));
Is there a way to style text with gradients?I've been looking for sth like:color-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(100%,#cccccc));
but wasn't able to find anything simple.
Thanks for your help.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
这是可能的。您只需将背景图像与背景剪辑组合起来即可: 文本:请参阅此处这个最优秀的示例。
It IS possible. You just have to combine a background-image with a background-clip: text: See this most excellent example here.
除非你使用图像来覆盖字体,否则使用纯 CSS 是不可能的:
http://www.webdesignerwall.com/tutorials/css-gradient-text-效果/
您可以使用相同的技术,但在覆盖元素中使用颜色到透明渐变。
这是一个带有纯 CSS 和附加元素的示例: http://jsfiddle.net/Lub7z/
its not possible with pure CSS unless you use a image to cover the font:
http://www.webdesignerwall.com/tutorials/css-gradient-text-effect/
You could use the same technique but use a color to transparent gradient in the overlay element.
here is an example with pure CSS and an additional element: http://jsfiddle.net/Lub7z/