牢记网客网域名:Wkone.cn网客网论坛
关注网社
扫官微看看大世界
手机版
扫码打开掌上乐圈
收起左侧

[美化/代码] 纯css实现简单的打字机效果

0
回复
58
查看
[复制链接]

 成长值: 7765

升级   100%

铭牌:未领取
10100

Rank: 129Rank: 129Rank: 129

钻石:1790 颗

氪券:581 票

买家信用:0 元

K币:1752 枚

土豪勋章055022052

发表于 2019-10-4 00:45:33 | 显示全部楼层 |阅读模式          

马上注册~开启兴趣社区世界~享技术乐生活。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
以下几行代码可以实现纯css实现打字机的效果。
css部分:
  1. .print{
  2. width:250px;
  3. white-space:nowrap;
  4. overflow:hidden;
  5. -webkit-animation: dy 3s steps(60, end) infinite;
  6. animation: dy 3s steps(50, end) infinite;
  7. }
  8. @-webkit-keyframes dy{
  9. from { width: 0;}
  10. }
  11. @keyframes dy{
  12. from { width: 0;}
  13. }
复制代码

html部分:
  1. <p class="print">网客网 新颖的创意,精美的视觉</p>
复制代码

温馨提示:
1、在论坛里发表的文章仅代表作者本人的观点,与本网站立场无关。
2、论坛的所有内容都不保证其准确性,有效性,时间性。阅读本站内容因误导等因素而造成的损失本站不承担连带责任。
3、当政府机关依照法定程序要求披露信息时,论坛均得免责。
4、若因线路及非本站所能控制范围的故障导致暂停服务期间造成的一切不便与损失,论坛不负任何责任。
5、注册会员通过任何手段和方法针对论坛进行破坏,我们有权对其行为作出处理。并保留进一步追究其责任的权利。
6月不努力,九月当兄弟,我在训练场上等着你!
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关闭

站长推荐上一条 /1 下一条

发布资源 返回列表 客服中心 搜索 官方QQ群
技术资源享你所想

人工客服电话

1314-520-6071

客服QQ:3388700000

官方邮箱:1@wkone.cn

站长QQ:785256319

关注我们
  • 关注官方微信

  • 手机APP

图片上传Archiver手机版小黑屋网客网论坛 ( 浙ICP备16034716号-1 )

Powered by 梦创深蓝 V1.1   © 2019-2020 WKone.cn Inc.