知识改变命运! css实现漂亮的文字,字体颜色渐变,七彩文字_newnew-lskyf博客社区

css实现漂亮的文字,字体颜色渐变,七彩文字

newnew 7月前 ⋅ 848 阅读 ⋅ 7 个赞

效果图

aa.png

css代码

.gradient-text {
      background-image: linear-gradient(to right, #ff0000,orange,yellow,green, #00ff00,blue,purple);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      text-fill-color: transparent;
    }

html


 <h1 class="gradient-text">这是美丽的字体,颜色渐变,lskyf.com这是美丽的字体,颜色渐变,lskyf.com这是美丽的字体,颜色渐变,lskyf.com这是美丽的字体,颜色渐变,lskyf.com</h1>

完整代码


<!DOCTYPE html>
<html>
<head>
  <style>
    .gradient-text {
      background-image: linear-gradient(to right, #ff0000,orange,yellow,green, #00ff00,blue,purple);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      text-fill-color: transparent;
    }
  </style>
</head>
<body>
  <h1 class="gradient-text">这是美丽的字体,颜色渐变,lskyf.com这是美丽的字体,颜色渐变,lskyf.com这是美丽的字体,颜色渐变,lskyf.com这是美丽的字体,颜色渐变,lskyf.com</h1>
</body>
</html>

全部评论: 0

    我有话说:

    IntelliJ IDEA如何设置字体大小呢?

    IntelliJ IDEA如何设置字体大小呢? 依次点击操作 file--->Settings--->Editor--->font--->Size--->填入需要字号

    越优秀人往往越努力

    早上起来打开微博特别关注,看见我特别喜欢一个作家杨熹了,当然了她每天都发几条微博,一条是自己写文章,还有几条关于自律力视频。 来自杨熹微博 刚认识她是因为公众号:“请尊重一个姑娘

    Spring Boot系列8-使用jasypt加密配置文件内容简单版

    文章目录 1.为什么配置文件需要加密 2.首先引入pom依赖文件 3.在application.properties或者application.yml文件中配置加密密码 4.获取加密内容例如:我想

    xshell可以实现本地编辑服务器运行效果吗?这样就不必每次都手动修改上传了

    需求背景: xshell可以实现本地编辑服务器运行效果吗?这样就不必每次都手动修改上传了 Xshell操作说明: Xshell可以实现本地编辑服务器运行效果。Xshell是一款功能强大SSH

    SpringBoot系列19-防止重复请求,重复表单提交超级简单注解实现之四(终极版II)

    前言: 根据最新spring boot:2.5.0版本和在《SpringBoot防止重复请求,重复表单提交超级简单注解实现之四(终极版I)》之上化繁为简抽取更实用代码,新增超时机制 防重复提交

    【扩展程序】 100套简历模板打包送你,有工作收藏!没工作用上!各行各业都可以用最漂亮简历打动HR,愿你有一个好工作。希望你有一份好薪水。

    ​ 前言 100套简历模板打包送你,有工作收藏!没工作用上!各行各业都可以用最漂亮简历打动HR,愿你有一个好工作。愿你有一份好薪水。愿你天黑有灯,下雨有伞! 下面看看有哪些简历 0001

    送您一个最高2000元阿里云大礼包,快来领取吧~

    送您一个最高2000元阿里云大礼包,快来领取吧~ ----> 点击领取阿里云大礼包<----

    利用AI文章批量生成器打造更深度内容技巧与方法

    要使用人工智能文章生成器创建更有深度内容,请参考以下提示: 1.使用高质量人工智能文章生成器:网上有很多人工智能文章生成器,但并非所有生成器都一样。选择一个在大型数据集上经过训练并能持续生成高

    SpringBoot系列21-实现策略模式

    如何在spring boot 中使用@component 实现策略模式 1.在 Spring Boot 中实现策略模式可以使用 @Component 注解来将策略类标记为 Spring 组件,并

    电池寿命优化指南:实用步骤助你释放手机电池超能力

    引言: 曾经有一群拥有非凡能力手机电池,它们可以让你手机连续工作数天。但是,在现实世界中,我们需要更实用方法来延长电池寿命。本指南将为你提供详细步骤,帮助你释放手机电池超能力。 步骤 1

    Linux 快捷键教程:如何挂起正在编辑文件并在后台运行,再次调回前台继续编辑

    在 Linux 中如何将正在编辑文件挂起到后台并在后台运行,以便在编辑其他文件后返回并继续编辑? 在 Linux 中,您可以使用 "Ctrl + Z" 快捷键将当前正在运行进程(包括正在编辑

    SpringBoot系列10-文件上传

    文章目录 1.先来最简单 2.设置文件大小,请求大小 3.多文件上传 怎样使用最简单方式上传文件,如何上传多个文件呢 先来最简单 pom.xml文件引入依赖文件 <

    csdn博客专栏出bug了好久了,之前我申请专栏不见了,我专栏达人勋章也不见了,后面申请专栏文章数量不正确,热度也不正确!

      csdn博客专栏出bug了好久了,之前我申请专栏不见了,我专栏达人勋章也不见了,后面申请专栏文章数量不正确,热度也不正确!客服说工程师在修复,不知道什么时候修复好啊!我之前专栏

    java实现判断是手机端还是pc端访问, nginx实现判断是手机端还是pc端访问

    1.编写工具类 /** * @author 缘分哥 * @description 判断是否移动端工具 */ public class ClientUtils { public static String[] mobileAgents = { "i...

    java高频面试题-Spring中Bean生命周期

    Spring中Bean生命周期有如下过程: 1.Bean容器找到配置文件中Spring Bean定义。 2.Bean容器利用Java Reflection API创建一个Bean实例。 3

    加入公众号
    加入公众号