網(wǎng)頁設(shè)計中最重要的細節(jié)之一——字體(6)

font-family：用于定義字體，上面有演示不多說。更詳細的資料請看：font-family。

font-style：用于定義字體的樣式，包括正常、斜體、傾斜等，對應(yīng)的屬性值為：normal – 文本正常顯示、italic – 文本斜體顯示、oblique – 文本傾斜顯示。

font-weight：用于定義文字的粗細，詳細的屬性值請看：font-weight。

font-size：設(shè)置字體大小，不再贅述。

line-height：用于設(shè)置文字中的行間距，合適的行間距對用戶閱讀帶來良好體驗。同時還可以用于垂直布局單行文字。

letter-spacing：設(shè)置文字之間的字間距，使文字之間的距離增大或者減小。

word-spacing：用于調(diào)整單詞的間距。

text-align：用來對齊文字，例如左對齊、右對齊、居中對齊等。

text-decoration：用來修飾一段文本，例如添加下劃線等。常對 a 標簽使用這個屬性消除其默認的下劃線。

上面是與字體相關(guān)，比較常用的 CSS 屬性，還有其他更加具體的，可以參考網(wǎng)上的資料，推薦 W3school 上面的有關(guān)字體的資料。

使用在線字體

在 CSS3 中，引入了一個非常強大而且實用的功能來面對上面的字體選擇問題。傳統(tǒng)的字體選擇，要你的操作系統(tǒng)中安裝相應(yīng)字體才可以顯示。如果你在網(wǎng)頁作品中，使用了其他的創(chuàng)意字體，那么你需要生成相應(yīng)的文字圖片來替換，否則不會顯示。CSS3 中的這個功能，就是 Web Fonts，網(wǎng)頁中可以使用安裝在服務(wù)器端的字體。你可以將選擇好的字體，上傳到服務(wù)器中，然后使用 CSS3 新增的 @font-face 屬性，來調(diào)用服務(wù)器上的字體，然后來渲染網(wǎng)頁。

支持 CSS3 這一功能的瀏覽器，會首先找到服務(wù)器上的字體，然后下載下來進行渲染。這樣就徹底解決了本地操作系統(tǒng)中，沒有對應(yīng)字體的問題。關(guān)于 @font-face 的具體使用方法，由于比較多，在本文不再贅述，請大家自行百度之：@font-face的使用方法。

既