css 渐变
https://blog.csdn.net/hncu1990/article/details/118878493
<!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>
body {
background: #000;
}
@property --angle {
syntax: "<angle>";
initial-value: 0deg;
inherits: false;
}
h1 {
text-align: center;
font-size: 150px;
font-weight: 900;
line-height: 150px;
word-spacing: 100vw;
color: transparent;
-webkit-background-clip: text;
/* var(--angle), */
/* background-image: linear-gradient( #02c4ff 30%,#000 30%,#02ff9e 30%, #000 30%,#f8f406 30%); */
background-image: linear-gradient(var(--angle),
#02c4ff 30%,
/* 这里的0，是缩写，相当于33.3% */
#000 0,
#000 35%,
/* 这里的0，是缩写，相当于66.6% */
#09f8b0 0,
#09f8b0 65%,
#000 0,
#000 70%,
#f6fa03 70%
/* #ff8235 70%, */
);
background-clip: text;
animation: rotate 5s infinite
}
@keyframes rotate {
to {
--angle: 360deg
}
}
</style>
</head>
<body>
<h1>沸点圈子 技术交流圈 内推招聘广场 AI聊天室 111</h1>
</body>
</html>
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· 单线程的Redis速度为什么快？
· 展开说说关于C#中ORM框架的用法！
· Pantheons：用 TypeScript 打造主流大模型对话的一站式集成库
· SQL Server 2025 AI相关能力初探