纯css实现打字效果
css
.print{
width:250px;
white-space:nowrap;
overflow:hidden;
-webkit-animation: dy 3s steps(60, end) infinite;
animation: dy 3s steps(50, end) infinite;
}
@-webkit-keyframes dy{
from { width: 0;}
}
@keyframes dy{
from { width: 0;}
}
html:
<p class="print">Rookie-Front end learning</p>
效果:
Rookie-Front end learning
温馨提示 : 非特殊注明,否则均为©李联华的博客网原创文章,本站文章未经授权禁止任何形式转载;IP地址:44.222.82.133,归属地:弗吉尼亚州Ashburn ,欢迎您的访问!
文章链接:https://www.ooize.com/pure-css-to-achieve-typing-effect.html
文章链接:https://www.ooize.com/pure-css-to-achieve-typing-effect.html
订阅
登录
0 评论