用CSS制作美觀的標題文字效果

用CSS制作美觀的標題文字效果

　　用CSS制作美觀的標題文字效果

　　聞立鷗

　　（北京財貿職業學院，北京101101）

　　摘要：現在CSS3和HTML5已經開始流行，很多網頁視覺效果是可以使用CSS來完成的，本文通過案例系統闡述如何用CSS來制作美化網頁的標題文字。

　　關鍵詞：CSS；標題；效果

　　一、什么是CSS

　　CSS意為層疊樣式表。“樣式”就是格式，是個中元素在網頁中呈現的形態，如文本的大小及顏色、圖片大小即位置等。而“層疊”就是在網頁中如果同時定義了幾個樣式，而這幾個樣式如果互相沖突時，將會按照樣式表文件的先后順序進行應用。CSS具有對網頁的布局、顏色、背景、寬度、高度、字體進行控制，讓網頁按您的美工設計布局的更加美觀漂亮。CSS是一種比較先進的網頁控制技術，使用它可以非常精確地控制網頁對象的格式，如果網頁中應用了CSS技術，當修改CSS樣式時，網頁中所有應用該樣式的文本會自動更新。樣式表信息包括在<style></style>標記中。如下圖：

　　二、用CSS實現標題文字效果

　　現在CSS3和HTML5已經開始流行，很多網頁視覺效果是可以使用CSS來完成的，今天向大家展示一下如何用CSS來美化大標題文字，如下圖效果，只要熟練掌握CSS代碼并靈活應用，只需要簡單幾步就可以制作出來，比起用PS來制作要簡單很多。下面一起看看如何用CSS代碼來實現。

　　CSS實現3D感文字標題，效果如下圖：

　　通過以上實例，我們可以看到，應用CSS樣式可以很輕松的制作網頁特效文字，而且稍作代碼的更改就可以迅速改變文字的顯示效果。但是，通過實踐要注意的是，首先，如果對網頁文字使用CSS濾鏡的樣式，一定要先把文字放在表格里，然后對該表格去應用CSS樣式文件。尤其是在做網頁遮罩文字效果時。實踐證明，應對該文字所在的單元格去應用CSS樣式才有效，而不是按常規對表格應用了。其次，要注意瀏覽器對CSS濾鏡的兼容性，要適當靈活地調整相應的代碼，以適應不同的瀏覽器。

　　三、結語

　　當前使用內容與表現相分離的技術制作網頁已是必然趨勢，其中內容指HTML頁面代碼，表現就是CSS代碼了，網頁的文字、圖片、顏色、布局等都由CSS控制。如果把網頁看成具有漂亮包裝的物品的話，物品就是HTML、是內容，而包裝就是CSS、是表現，不同的包裝體現物品的不同風格特點；不同的CSS就可以實現不同的文字效果、圖片效果、版面編排效果，使頁面出現不同的風格，適用不同的網站。

　　參考文獻：

　　[1]曾靜娜。新手學CSS+DIV[M].北京希望電子出版社，2010.[2]金峰。變幻之美CSS+DIV網頁布局揭秘[M].北京：人民郵電出版社，2009.

　　[3]聞立鷗。CSS+DIV布局與表格布局網頁的對比[J].教育教學論壇，2014，（9 ）。

　　[4]聞立鷗。DIV+CSS之布局一行三列頁面實證分析[J].教育教學論壇，2014，（8 ）。

　　[5]賈錚，等。HTML+CSS網頁布局開發指南[M].北京：清華大學出版社，2008.

　　[6]CSS：The Definitive Guide，3rd Edition，Eric Meyer，O&acute;Reilly，2006.

【用CSS制作美觀的標題文字效果】相關文章：

淺談信息標題的制作-范文08-17

PowerPoint制作有主題的標題幻燈片（教學設計）08-23

標題的修辭藝術08-17

小標題作文03-11

美術教案－美觀大方08-16

用word制作求職簡歷的技巧201608-15

以風箏為標題的作文08-15

語文 －插入藝術標題08-16

怎樣給文章擬標題08-17

女裝店標題語12-28