文字是網頁中最基本的元素，在CSS2.0時代，我們只能在網頁上展示靜態的文字，只能改變他的大小和顏色，顯得枯燥無味。隨着HTML5的發展，現在網頁中的文字樣式變得越來越豐富了，甚至出現了文字動畫，HTML5和CSS3的強大之處就在於此。本文分享的10款炫酷的HTML5文字動畫特效非常不錯，一起來看看吧。
1、HTML5 Canvas粒子效果文字動畫特效
之前我們分享過很多超酷的文字特效，其中也有利用HTML5和CSS3的。今天我們要來分享一款基於HTML5 Canvas的文字特效，輸入框中輸入想要展示的文字，回車后即可在canvas上繪制出粒子效果的文字動畫，相當酷的動畫效果。
2、CSS3 3D鏤空文字特效
之前我們有分享過一款鏤空效果的CSS3按鈕，鏤空部分可以定義其他的背景圖片。今天我們要介紹的也是一款基於CSS3的鏤空文字特效，這樣的鏤空文字效果在以前很難實現，必須使用背景圖片，但是現在利用CSS3，這種鏤空效果變得非常簡單。
3、HTML5粒子效果的文字動畫特效
記得之前向大家分享過一款HTML5 Canvas實現會跳舞的時間動畫，利用了HTML5的粒子動畫特性。今天要分享的也是一款基於HTML5的粒子效果的文字動畫特效，並且它可以實現每個文字的逐幀播放，形成一句很浪漫的詩句。
4、CSS3 3D折疊翻轉文字動畫
今天我們再來分享一款CSS3文字特效應用，和之前分享的這款HTML5/CSS3文字特效類似，它也是一款CSS3 3D折疊翻轉文字動畫，只要將鼠標滑過文字，文字的另一面即可像翻頁一樣翻轉開來，呈現3D立體的視覺效果，這一切都是CSS3實現的。
5、CSS3實現文字局部背景圖案效果
這次要分享的是一款利用CSS3實現的文字特效，這款CSS3文字特效可以使文字的任意局部背景自定義，這樣我們的一個文字不同區域就可以定義不同的背景顏色和背景圖片。之前我們也分享過一篇文章用CSS3美化半個字符巧妙方法，這就是實現原理。
6、超炫CSS3文字特效集錦
今天我們要來分享十幾種樣式各異的CSS3文字特效，有些是3D的文字效果，有些是帶有立體的文字陰影，而且色彩也都很不錯。這幾款CSS3文字特效用了很多text-shadow和filter屬性，是這些CSS3屬性，讓枯燥的黑白文字變得如此生動，盡管它們都是靜態的文字。
7、HTML5自定義背景圖片的文字特效
在HTML5和CSS3標准出來之前，文字的背景只能是純色，更不用說是自定義背景圖片了。然而，強大的HTML5不僅讓文字背景支持漸變顏色，而且支持自定義的背景圖片，這些圖片就像遮罩層，讓文字的背景變得豐富多彩。
8、10組CSS3鼠標滑過文字動畫特效
之前我們分享過很多CSS3文字動畫特效，比如CSS3 3D鏤空文字特效和HTML5粒子效果的文字動畫特效。今天要介紹10組基於CSS3的鼠標滑過文字動畫特效，有上凸、下凹等文字動畫。這些炫酷的CSS3文字效果可以讓網頁變得更加絢麗。
9、CSS3 3D超鏈接 點擊鏈接效果更酷
之前我們分享過很多CSS3 3D效果的文字，今天我們來介紹一款用純CSS3實現的3D超鏈接，一眼看上去，和之前的CSS3 3D文字沒什么區別，但是當你點擊文字鏈接時，3D效果就出來了，文字鏈接會下陷進去，移開鼠標時，文字鏈接又會浮上來，很酷的CSS3 3D鏈接特效。
10、HTML5自定義文字背景生成QQ簽名檔
這是一款利用HTML5實現的自定義文字背景應用，首先我們可以輸入需要顯示的文字，並且為該文字選擇一張背景圖片，背景圖片就像蒙版一樣覆蓋在文字上。點擊生成QQ簽名檔即可將文字背景融為一體生成另外一張圖片，你也可以下載這張擁有你QQ簽名檔的圖片。
以上就是10大炫酷的HTML5文字動畫特效，歡迎收藏分享。
轉載請注明原文鏈接：http://www.html5tricks.com/10-cool-html5-text-animation.html