1、现在这里我想修改一下颜色
2、第一种修改颜色的方法：
.gradient-text-one{ background-image:-webkit-linear-gradient(bottom,red,#fd8403,yellow); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
添加上述代码呈现的样式是这样
这里我并不知道这里面是什么意思
3、这里接单讲一讲，他的使用：
3.1 样式颜色从上往下：只要两个
font-size: 40px; background-image: -webkit-linear-gradient(blue, red); -webkit-background-clip: text; -webkit-text-fill-color: transparent;
3.2 /* 渐变轴为45度，从蓝色渐变到红色 */ linear-gradient(45deg, blue, red);
font-size: 40px; background-image: -webkit-linear-gradient(45deg, blue, red); -webkit-background-clip: text; -webkit-text-fill-color: transparent;
3.3 /* 从左上到左下、从蓝色渐变到红色 */
.helloworld { font-size: 40px; background-image: -webkit-linear-gradient(left top, blue, red); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
3.4 /*实现文字颜色从红到黄的线性渐变效果*/
.helloworld { font-size: 40px; background: linear-gradient(to right, #ff0000 50%, #ffff00 51%); /*设置渐变的方向从左到右 颜色从ff0000到ffff00*/ /*设置渐变的方向从左到右 颜色从ff0000到ffff00*/ -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
/*实现文字颜色从红到黄的线性渐变效果*/ .gradient-text { background: linear-gradient(to right, #ff0000, #ffff00); /*设置渐变的方向从左到右 颜色从ff0000到ffff00*/ -webkit-background-clip: text;/*将设置的背景颜色限制在文字中*/ -webkit-text-fill-color: transparent;/*给文字设置成透明*/ }
3.5 在指标后可以定义截止的颜色
.helloworld { font-size: 40px; background: linear-gradient(to right, #ff0000 50%, #ffff00 51%); /*设置渐变的方向从左到右 颜色从ff0000到ffff00*/ /*设置渐变的方向从左到右 颜色从ff0000到ffff00*/ -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
