首页 > 其他分享 >css实现文字切换

css实现文字切换

时间:2023-09-21 10:34:14浏览次数:30  
标签:文字 textc -- text change num 切换 css

.textc {
    --num: '今日大吉';
    animation: text-change 3s linear forwards;
}
.textc::after{
    content: var(--num);
    font-size: 20px;
}
@keyframes text-change {
    33% {
        --num: '明日好运';
    }
    67% {
        --num: '后天康复';
    }
    100% {
        --num: '钱途似锦';
    }
}

 

标签:文字,textc,--,text,change,num,切换,css
From: https://www.cnblogs.com/mengff/p/17719268.html

相关文章

  • Android 妙用TextView实现左边文字,右边图片
    有时候,需要文字在左边,右边有个箭头,我个人之前会有两种做法:使用线性布局来实现或者使用约束布局,一个左对齐,一个右对齐这几天突然想到是否可以使用TextView的设置图标的方式实现,研究发现确实可以实现我的需求,也是记录下文字和图标左右显示效果:代码:<TextViewandroid:id="@+id/......
  • 文件/目录的权限和归属 访问权限 读取:允许查看文件内容、显示目录列表 写入:允许修改
    文件/目录的权限和归属 访问权限读取:允许查看文件内容、显示目录列表写入:允许修改文件内容,允许在目录中新建、移动、删除文件或子目录可执行:允许运行程序、切换目录归属(所有权)属主:拥有改文件或目录的用户账号属组:拥有该文件或目录的组账号,组中用户查看文件/目录的权限和归属......
  • java实现百度OCR图片文字识别
    java实现百度OCR图片文字识别最近在做一个扫描图片识别文字的功能,决定用百度AI开发平台完成1打开网址​ 打开地址:https://ai.baidu.com/手机验证码登录2选择通用文字识别开放能力->文字识别->通用文字识别3进入到通用文字识别页面4API的调用使用方式(1)首先......
  • html与css小知识
    html入门学习参考资料:https://www.cnblogs.com/gh110/p/15153664.html参考视频:https://www.bilibili.com/video/BV1x4411V75C扩展:qq邮箱扩展(点击联系我)可以打开qq推广弄iframe可以作为a标签的目标,然后一键点击跳转!点文字就可以锁定文字对应的框表单......
  • 看到过的css 属性!!!
    记录一下看到过的,没见过的不知道就算了; inline-size:60pxblock-size:30pxpadding-block:10px这三个文字属性和writing-mode:有关,writing-mode设置文字是从左往右排列还是从上往下   关于nth-child!!! MDN文档里解释p:nth-child(1){background-color......
  • 用css控制td强制换行
    即便是给td限定的宽度,但是如果里面的内容是连续的,IE就认为是一个单词,不会换行。控制td换行的css样式:style="word-wrap:break-word;word-break:break-all;"<tablewidth="100%"border="0"cellspacing="1"cellpadding="0"><tr><tdwi......
  • css字体---跨站引入报跨域问题【解决方法】
    最近遇到一个问题,考虑到网站的性能,需要将图标字体单独放到一个网站引入,减少资源占用,但是遇到一个问题,引入字体文件的时候,报跨域的错误。具体解决方法:将图标字体转base64转换网址:https://transfonter.org/按照以下三个步骤进行操作: 然后下周这个: 里面有个:stylesheet.cs......
  • CSS的选择器
    CSS的选择器分为全局选择器、元素选择器、类选择器、ID选择器和合并选择器1.全局选择器<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width,initial-scale=1.0"&......
  • 基于百度AI实现文字和图像敏感内容审核
    前言百度AI是指百度公司的人工智能技术全称。它采用深度学习技术,包括自然语言处理、语音识别、计算机视觉、知识图谱等,可应用于各个领域如互联网、医疗、金融、教育、汽车、物流等。百度AI的发展将帮助人类更好地理解世界和提高生活品质,接下来就通过一个小案例演示实现百度AI在文......
  • 短视频app源码,Android TextView文字,删除线以及下划线
    短视频app源码,AndroidTextView文字,删除线以及下划线1、删除线 TextViewtextview=(TextView)view.findViewById(R.id.textviewk);textview.getPaint().setFlags(Paint.STRIKE_THRU_TEXT_FLAG);​2、下划线 TextViewtextview=(TextView)view.findViewById(R.id.textvi......