当前位置:首页 > 技术博客 > CSS > CSS字体动画渐变效果

CSS字体动画渐变效果

3年前 (2022-05-12)CSS1250


这是一款个性新颖的css文字特效代码,css字体渐变效果,画面中的文字不仅呈现颜色的渐变效果且伴随炫酷的闪烁效果。


<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>CSS字体动画渐变效果</title>
    <style>
      body {
        background: rgb(197, 196, 196);
        margin: 0;
      }
      main {
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
      }
      .text {
        background: url(/zb_users/upload/2023/09/20230919023723169506224356174.webp);
        background-size: contain;
        background-position: top left;
        -webkit-background-clip: text;
        color: transparent;
        font-size: 10rem;
        font-weight: bold;
        font-family: sans-serif;
      }
    </style>
  </head>
  <body>
    <main>
      <div class="text">LiuZhiXi.CN</div>
    </main>
  </body>
</html>


版权声明:本文由 LzxBlog 发布,如需转载请注明出处。

本文链接:https://www.liuzhixi.cn/html/257.html

标签: CSS渐变文字

相关文章

拟物风的账号密码登录框ui特效

拟物风的账号密码登录框ui特效

一款css3制作简洁通用的网页登录框,邮箱密码输入框登录特效。<style> body {   margin:&n...

css3:hover悬停图标展开气泡文本框特效

css3:hover悬停图标展开气泡文本框特效

css3 hover属性制作鼠标悬停图标或标题展示动画文本框效果,类似气泡一样文本框动画特效。下载链接: https://pan.baidu.com/s/1Fc...

炫酷的登录注册表单切换代码

炫酷的登录注册表单切换代码

基于CSS3属性制作创意的登录注册表单样式,酷炫的登录/注册表单ui特效。下载链接: https://pan.baidu.com/s/1hhpCnROFc0gT...

让网站支持苹果的 黑暗模式(深色Dark模式)

让网站支持苹果的 黑暗模式(深色Dark模式)

prefers-color-scheme 用于检测用户的系统主题是浅色或深色,此属性有三个值no-preference 表示用户未指定操作系统模式,其...

CSS原子环绕标志动画

CSS原子环绕标志动画

CSS原子环绕标志动画<head> <meta charset="UTF-8"> <meta...

纯css loading

纯css loading

页面加载loading沙漏动画特效<html> <head> <style> .container {...

发表评论

访客

看不清,换一张

◎欢迎参与讨论,请在这里发表您的看法和观点。