我们先写一个基本的html，里面有一个div和一段文字。
先看下现在的页面，文字显示的就是默认的黑色字体。
要更改字体颜色，我们可以通过css样式来设置。
为.font 这个样式规则添加样式代码，很简单，就是添加color的样式，样式值为红色：red。代码如图。
再看下我们的网页，文字的颜色已经变成红色了。
64-文字渐变效果
<!-- * @Descripttion: * @Author: voanit * @Date: 2022-12-02 21:21:24 * @LastEditors: voanit * @LastEditTime: 2022-12-02 21:45:57--><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .gradient-text { width: 800px; font-size: 140px; color: transparent; background: -webkit-linear-gradient(360deg,red, #32c5ff 25%, #b620e0 50%, #f7b500 75%, #20e050 100%); background-clip: text; -webkit-background-clip: text; /* -webkit-text-fill-color: transparent; */ /* background-size: auto; */ } .gradient-text { animation: gradientText 30s infinite linear; -webkit-animation: gradientText 300s infinite linear;}@keyframes gradientText { 0% { background-position: 0; } 100% { background-position: 8000px; }} </style></head><body> <div class="gradient-text">web~前端</div></body></html>
