CSS可以實現跑馬燈效果,讓網頁更有活力和變化。下面是使用CSS實現跑馬燈的代碼:
marquee { display: block; white-space: nowrap; overflow: hidden; box-sizing: border-box; animation: marquee 20s linear infinite; } @keyframes marquee { 0% { transform: translateX(100%); } 100% { transform: translateX(-100%); } }
使用前需要在HTML中添加marquee標簽,并在其中添加需要滾動的內容。例如:
<marquee>這是一條跑馬燈效果的文字</marquee>
需要注意的是,marquee標簽已經被HTML5廢棄,因此建議使用CSS3實現該效果。
使用以上代碼,即可在瀏覽器中看到跑馬燈效果。
上一篇文字css好看的效果