使用CSS可以對(duì)HTML頁(yè)面中的文字進(jìn)行全方位的設(shè)置，本文從基礎(chǔ)的文字設(shè)置出發(fā)，詳細(xì)講解設(shè)置各種CSS文字效果的方法，然后再進(jìn)一步講解段落排版的相關(guān)內(nèi)容，希望本文介紹對(duì)你有所幫助。

設(shè)置豐富的CSS文字效果

文字是網(wǎng)頁(yè)設(shè)計(jì)種永遠(yuǎn)不可缺少的元素，各種各樣的文字效果遍布在整個(gè)英特網(wǎng)中。本文從基礎(chǔ)的文字設(shè)置出發(fā)，詳細(xì)講解設(shè)置各種CSS文字效果的方法，然后再進(jìn)一步講解段落排版的相關(guān)內(nèi)容。

CSS文字樣式

使用過Word編輯文檔的用戶一定對(duì)會(huì)注意到，Word可以對(duì)文字的字體、大小、顏色等各種屬性進(jìn)行設(shè)置。CSS同樣可以對(duì)HTML頁(yè)面中的文字進(jìn)行全方位的設(shè)置。我們?cè)谶@里在上兩章的基礎(chǔ)上主要介紹設(shè)置CSS文字各種屬性的基本方法。希望大家能夠掌握以下幾個(gè)方面的內(nèi)容：

字體

文字大小

文字顏色

文字粗細(xì)

斜體

文字的下劃線、頂劃線、刪除線

英文字母大小寫

文字實(shí)例一：模擬Google公司logo

前面對(duì)設(shè)置CSS文字的各種單獨(dú)效果進(jìn)行了詳細(xì)的介紹，我們?cè)谶@里通過一個(gè)簡(jiǎn)單的實(shí)例，將各種效果綜合運(yùn)用，達(dá)到基本模擬Google公司logo的效果。

文字實(shí)例二：制作頁(yè)面的五彩標(biāo)題

對(duì)于任何文章，標(biāo)題的作用是顯而易見的。在頁(yè)面中標(biāo)題的設(shè)計(jì)往往也決定著整個(gè)頁(yè)面的風(fēng)格樣式。我們?cè)谶@里以CSS設(shè)計(jì)標(biāo)題為例，進(jìn)一步介紹CSS在控制文字時(shí)的各種方法和技巧。對(duì)于我們?cè)谶@里中使用的一些CSS屬性，前面課程可能還沒有涉及，讀者不必深究，在以后的課程都將詳細(xì)介紹。

CSS段落文字

段落是由一個(gè)個(gè)CSS文字組合而成的，同樣是網(wǎng)頁(yè)中最最重要的組成部分，因此前面提到的文字屬性，對(duì)于段落同樣適用。但CSS針對(duì)段落也提供了很多樣式屬性，我們?cè)谶@里將通過實(shí)例進(jìn)行詳細(xì)介紹。希望大家能夠掌握以下幾個(gè)方面的內(nèi)容：

段落的水平對(duì)齊方式

段落的垂直對(duì)齊方式

行間距和字間距

首字放大

段落實(shí)例：百度搜索

搜索引擎一直都是在網(wǎng)上沖浪必不可少的工具，而搜索引擎在顯示搜索結(jié)果時(shí)如何能讓用戶一目了然的找到關(guān)鍵字，是每一個(gè)搜索網(wǎng)站在排版時(shí)都必須認(rèn)真對(duì)待的，而各種搜索結(jié)果恰恰都只是文字段落為主。作為國(guó)內(nèi)搜索引擎霸主之一的百度一直保持著友好的用戶界面。我們?cè)谶@里通過具體實(shí)例，模擬Baidu搜索的顯示結(jié)果，進(jìn)一步鞏固CSS文字、段落的排版方法。

【編輯推薦】

1. CSS中display屬性的妙用
2. 編碼過程中靈活使用CSS注釋
3. 14大CSS工具提高網(wǎng)頁(yè)設(shè)計(jì)效率
4. 實(shí)現(xiàn)DIV圖片居中方法揭秘
5. 鼠標(biāo)經(jīng)過時(shí)改變DIV背景顏色的三種途徑