特效描述:纯css3 标题文字 间歇滚动效果。纯css3标题文字滚动。
代码结构
1. HTML代码
<section class='section'> <div class='masthead-image' id='master-container'> <div class='content center'> <h1 id='master'> <div>Hello</div> <div id='master-container-scroller'> <div class='master-container-scroller_item'> <a class='cta-link' href='#'>Friend</a>. </div> <div class='master-container-scroller_item'> <a class='cta-link' href='#'>Enemy</a>. </div> <div class='master-container-scroller_item'> <a class='cta-link' href='#'>Frenemy</a>. </div> <div class='master-container-scroller_item'> <a class='cta-link' href='#'>Mom</a>. </div> <div class='master-container-scroller_item'> <a class='cta-link' href='#'>Dad</a>. </div> <div class='master-container-scroller_item'> <a class='cta-link' href='#'>Brother</a>. </div> <div class='master-container-scroller_item'> <a class='cta-link' href='#'>Sister</a>. </div> <div class='master-container-scroller_item'> <a class='cta-link' href='#'>Son</a>. </div> <div class='master-container-scroller_item'> <a class='cta-link' href='#'>Daughter</a>. </div> <div class='master-container-scroller_item'>Friend.</div> </div> <div>Nice to see you.</div> </h1> </div> </div> </section>