带有CSS的渐变文字

Laaposto

无论如何,我可以进行文本渐变吗?我有这个

<p>TEXT</p>

可以使用CSS使文本从上到下渐变吗?

我希望得到相同的结果 background: linear-gradient(#fbfbfb, #f2f2f2);

但仅适用于文本而不是整个背景。我看起来像这样:

color: linear-gradient(#fbfbfb, #f2f2f2); 
Laaposto

当我想要一个在所有浏览器中都能使用的解决方案时,我最终使用了jQuery插件。我用了这个http://www.codefocus.ca/goodies/gradienttext

HTML:

<div id="example1">TODO write content</div>

JS:

 $(document).ready(function(){
        $('#example1').gradienttext({
            colors: [
                '#FF0000',
                '#FF6600',
                '#CCFF00',
                '#00FF00',
                '#0066FF',
                '#FF00FF'
            ],
            style: 'horizontal'
        });

});

并包含适当的js(jQuery和GradientText v0.1)

但是还有很多其他插件可以使用。您可以检查:

- http://jquery-plugins.net/tag/gradient
- http://mrnix.ru/pxgradient/index_en.html
- https://github.com/Se7enSky/jquery-text-gradient

PS感谢您的回答,这些回答向我表明,纯CSS无法实现我想要的功能。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

带有CSS的渐变文字

来自分类Dev

带有渐变的CSS箭头

来自分类Dev

CSS:带有渐变的斜角边框?

来自分类Dev

与容器相邻的带有渐变的CSS形状

来自分类Dev

带有渐变的纯CSS Starburst轮

来自分类Dev

css渐变矩形下方带有圆形

来自分类Dev

CSS-带有水平渐变的垂直边框

来自分类Dev

带有渐变颜色CSS的多条圆线

来自分类Dev

试图创建带有渐变的纯CSS量规的边框故障

来自分类Dev

带有渐变蒙版的 CSS 垂直滚动字幕

来自分类Dev

带有偏移量的 CSS 重复渐变

来自分类Dev

带有渐变的Android数字

来自分类Dev

创建带有渐变的JLabel

来自分类Dev

创建带有渐变的JLabel

来自分类Dev

CSS文字::带有圆角的选择

来自分类Dev

带有线性渐变的CSS导航栏在Chrome中不显示背景

来自分类Dev

CSS3聚光灯效果,使用带有渐变的圆角矩形

来自分类Dev

如何通过CSS创建带有渐变色条纹边框的矩形?

来自分类Dev

在CSS中使用线性背景渐变效果后,带有超链接的图像不起作用

来自分类Dev

CSS:带有文本和渐变背景/边框的自适应细长六边形

来自分类Dev

重新创建带有渐变CSS3的网格

来自分类Dev

带有线性渐变的CSS导航栏在Chrome中不显示背景

来自分类常见问题

带有边界半径和渐变文本的渐变边界

来自分类Dev

带有边界半径和渐变文本的渐变边界

来自分类Dev

Android:从顶部绘制带有渐变的弧线

来自分类Dev

android创建带有渐变的馅饼

来自分类Dev

带有垂直渐变背景的箭头按钮

来自分类Dev

带有skimage或numpy的灰度渐变

来自分类Dev

带有渐变填充的圆形箭头形状