最近又发现了个好玩的；不用JavaScript的定时器；纯css就能实现打字效果了；这里记录一下。
<div class="typing-demo-wrapper"> <div class="typing-demo"> 你好；欢迎来到苏州网站建设 </div> </div>
.typing-demo-wrapper {
height: 200px;
overflow: auto;
}
.typing-demo {
width: 24ch;
/* typing 3s 表示3秒内打完这13个字 blink .5s表示0.5秒闪烁一下光标*/
animation: typing 3s steps(13), blink .5s step-end infinite alternate;
white-space: nowrap;
overflow: hidden;
/* 鼠标光标用右边的边框代替 */
border-right: 3px solid red;
font-size: 2em;
}
/* 实现从左到右打字效果 */
@keyframes typing {
from {
width: 0
}
}
/* 实现鼠标闪烁效果 */
@keyframes blink {
50% {
border-color: transparent
}
}以上主要使用了两个css3的keyframes 动画：typing 实现从左到右打字效果，blink实现鼠标闪烁效果
