純CSS3屬性animation實現的打字效果

出處：https://blog.csdn.net/u013018357/article/details/50765707

<h1 class="word title-h">文字內容，打字效果。。。</h1>

• 1

css樣式

.word{
    text-align: center;
    color: black;
    width:100%;
    white-space:nowrap;
    overflow:hidden;
}
.title-h{       letter-spacing: .3rem;        -webkit-animation: typing 2s steps(30, end) forwards;      animation: typing 2s steps(30, end) forwards;}
@-webkit-keyframes typing{
    from { width: 0;}
}

@keyframes typing{
    from { width: 0;}
}