返回列表 发帖
查看: 1163|回复: 0

html文字扫光特效

12

主题

56

回帖

182

积分

应用开发者

贡献
0 点
金币
10 个
QQ
发表于 2022-10-3 12:03:07 | 显示全部楼层 |阅读模式
HTML内:
  1. <div class="music-title">你的文字内容</div>
复制代码
CSS:
  1. <style scoped>
  2.     .music-title{
  3.         color: #040404;
  4.         background-image: -webkit-linear-gradient(left,
  5.         #FEFDFC,
  6.         #070707 25%,
  7.         #070707 50%,
  8.         #070707 75%,
  9.         #070707 100%);
  10.         -webkit-text-fill-color: transparent;
  11.         -webkit-background-clip: text;
  12.         -webkit-background-size: 150% 100%;
  13.         -webkit-animation: masked-animation 5s infinite linear;
  14.     }

  15.     @-webkit-keyframes masked-animation {
  16.         0% {
  17.             background-position: 0 0;
  18.         }
  19.         100% {
  20.             background-position: -100% 0;
  21.         }
  22.     }
  23. </style>
复制代码


回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

  • 关注公众号
  • 有偿服务微信
  • 有偿服务QQ

手机版|小黑屋|Discuz! 官方交流社区 ( 皖ICP备16010102号 |皖公网安备34010302002376号 )|网站地图|star

GMT+8, 2024-6-24 22:01 , Processed in 0.031962 second(s), 5 queries , Redis On.

Powered by Discuz! W1.0 Licensed

Cpoyright © 2001-2024 Discuz! Team.

关灯 在本版发帖
有偿服务QQ
有偿服务微信
返回顶部
快速回复 返回顶部 返回列表