纯css实现网页打字效果

我们经常看到别人网站上的一个字符逐个出现的打字效果，效果真的挺不错的，其实我们完全可以利用纯css实现网页打字效果。

.print{
  
    width:1000px;
    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;}
}

调用：

<p class="print">纯css实现网页打字效果，请在这里添加文字，肉松的站感谢你的支持！</p>

演示：

纯css实现网页打字效果，请在这里添加文字，肉松的站感谢你的支持！

出自：http://www.liumingye.cn/archives/190.html