font-size: 3em;
font-family: '微软雅黑';
background-image: linear-gradient(to right , #1b89b9, #0a3f7b); //最后三行为文字渐变CSS
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
原理与思路：
代码比较简单，主要是后面三行。
background-image属性
用于设置一个元素的背景图像。这里，给这个属性设置一种可用的背景颜色（渐变色），这样的话，假如背景图像不可用，就会使用背景色带代替。我们正是利用了这一点，达成了渐变效果。
-webkit-background-clip属性
作用是对背景图片进行裁剪，这里值是text，即是把文本内容之外的背景给裁剪掉。可惜这个属性只有chrome支持，这点需要注意！
-webkit-text-fill-color属性
作用是文字颜色填充，这里的值是transparent，即是透明填充。从某种程度上来讲text-fill-color与color基本上的作用是一样的，如果同时设置color与text-fill-color属性，text-fill-color颜色填充会覆盖color的颜色，也就是文字会显示text-fill-color设置的颜色，而不是color设置的颜色（当然这需要在浏览器支持text-fill-color属性的情况下）。同样，这个属性也只有chrome支持，这点需要注意！
tips:
最后，道路千万条，这只是实现文字渐变的其中一种，小伙伴们可以去尝试更多的方法。更有趣的是，以上知识结合动画还可以实现文字镂空和K歌字幕效果，唱K那么久，知道字幕是怎么变的吗？别好奇了，赶紧去试试吧！！
css
实现
文字
渐变
色(兼容性写法、渐进增强、平稳退化)
一、第一种方法通过background-clip
实现
原理
：为
文字
设置
渐变
背景颜色，并设置透明颜色
字体
，使用background-clip:text对背景进行裁剪，留下文本部分的背景，从而
实现
渐变
效果。
问题：background-clip: text的兼容性并不好，一旦浏览器不兼容，背景就会直接暴露出来。
<span class="linear-gradient-text"></span>
.linear-gradient-
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
开发工具与关键技术：DW，
HTML
，
css
作者：梁柏源
撰写时间：2019/2/10
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
background-image: -webkit-linear-gradient(left, #c1e6fd, #69a5cc);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
从左到右
渐变
的
CSS
字体
色可以通过以下几种方法
实现
:
1. 使用"background-clip"和"text-fill-color"属性。在
CSS
中，可以设置
文字
的背景颜色为
渐变
色，然后将
文字
的填充颜色设置为透明，这样就可以
实现
字体
从左到右
的
渐变
效果。
2. 使用"mask-image"属性。这个属性可以将图片作为遮罩来控制元素的可见性。可以使用
渐变
图片作为遮罩，然后将
文字
的颜色设置为透明，就可以
实现
字体
的
渐变
效果。
3. 使用"linearGradient"和"fill"属性。这两个属性可以通过定义线性
渐变
的起点和终点来
实现
字体
的
渐变
色效果。
以下是一个使用线性
渐变
实现
文字
从左到右
渐变
色的示例代码:
```
html
<!DOCTYPE
html
>
<meta charset="utf-8">
<style>
.text-gradient {
display: inline-block;
color: blue;
font-size: 3em;
font-family: '微软雅黑';
background-image: linear-gradient(to right , #1b89b9, #0a3f7b);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
</style>
</head>
<span class="text-gradient">
文字
渐变
色</span>
</body>
</
html
>
在这个例子中，我们使用了"linear-gradient"来定义
文字
的背景
渐变
色，然后使用"-webkit-background-clip"将背景应用到
文字
上，"-webkit-text-fill-color"设置
文字
的填充色为透明。这样就可以
实现
文字
从左到右
的
渐变
色效果。
Android studio3.0.1中Gradle错误：Error:Could not resolve all dependencies for configuration ':classpath'
18562
