html5跑馬燈

廢話不多說直接進入重點，要在網頁製作出跑馬燈的效果不用太複雜用HTML與CSS的效果就可以做出來了，在此附上範例程式碼。

接著，在 CSS 中定義跑馬燈的樣式，包括圖片的排列方式、滾動速度等：

文字：歡迎使用全螢幕跑馬燈！ 上傳圖片： 時間格式：12 小時24 小時. 倒數計時： 開始倒數. 字體：ArialVerdanaTimes New Roman. 字體大小：200px. 文字大小適應螢幕高度： 滾動速度： 水平滾動垂直滾動. 文字顏色： 背景顏色： 背景圖片： 恢復顏色背景. 文字閃爍： 關閉設置進入/退出全螢幕.

這篇教學會單純使用 CSS 製作文字跑馬燈效果，不僅會介紹「縮排」和「平移」兩種製作方式，還會說明例如裁切、轉換、縮排、動畫等互相搭配的控制技巧。

網頁跑馬燈是常見的一種表示方法，你可以透過簡單的語法製作符合網頁風格的跑馬燈，同時除了文字型跑馬燈之外，還可以設計成連結式或圖片式跑馬燈。 只要透過簡單的 HTML marquee 標籤就可以做到，再透過屬性參數的設定可以達到各種效果唷！

在剛開始學習網頁設計的時候，網頁跑馬燈肯定是必學的基礎，透過跑馬燈的點綴，可以輕鬆的讓網頁呈現效果生動起來，而且應用也是相當的廣泛，例如最新消息的呈現方式也可以採用跑馬燈的技巧，這裡教大家透過 HTML marquee 語法來製作跑馬燈的效果。

這支影片將帶你學習如何運用簡單的HTML程式碼，打造傳統且實用的「跑馬燈」效果，並將其完美嵌入到你的Google Sites中！