效果如图所示 不多说，纯css3就可以达到这样的效果。原理也很简单，就是给文字加一个渐变的背景套上，同理也可以用图片做背景一样可以达到这种效果。

代码如下：

background: linear-gradient(to right, red, blue);
        -webkit-background-clip: text;
        color: transparent;

很简单一段代码，然后里面第一行结尾有两个颜色属性，你可以照着多写几个颜色代码在里面从而达到彩色字体的效果。

颜色代码之间记得加英文的半角逗号，不然会出现错误。

方法很简单，上面的to right就是从左到右的颜色渐变规则，你也可以改成由上到下，有右到左等等，还可以45°颜色渐变。

话不多说，大家可以自己试试，代码很简单，好像在版本低的浏览器不会显示，自测吧。