網(wǎng)頁(yè)設計師應該清楚地認識到，字體選擇是一個(gè)常見(jiàn)（而且重要）的特性。畢竟，有多少頁(yè)面分布著(zhù)數十個(gè)甚至數百個(gè)<FONT FACE="...">標記呢？實(shí)際上，規范中“字體屬性”一節最開(kāi)始就有這樣一句話(huà)：“設置字體屬性是樣式表的最常見(jiàn)用途之一?！?/p>

不過(guò)，盡管字體選擇很重要，但是目前還沒(méi)有一種辦法能確保在網(wǎng)頁(yè)上一致地使用字體，因為沒(méi)有一種統一描述字體和字體的變形的方法。例如，字體Times、Times New Roman和TimesNR可能很類(lèi)似，甚至完全相同，不過(guò)網(wǎng)頁(yè)瀏覽器怎么能知道這一點(diǎn)呢？網(wǎng)頁(yè)設計師可能在一個(gè)文檔中指定字體為T(mén)imesNR，但是如果用戶(hù)機器上沒(méi)有安裝這種字體，用戶(hù)查看文檔時(shí)會(huì )看到什么呢？即使安裝了Times New Roman，用戶(hù)代理也不知道這兩個(gè)字體（Times New Roman和TimesNR）實(shí)際上是可以互換的。如果你希望一個(gè)閱讀器上一定采用某種字體，請別妄想了。

盡管CSS2支持可下載字體，并定義了相應屬性，不過(guò)這些字體在Web瀏覽器中并未得到很好的實(shí)現，而且出于性能方面的原因，閱讀器總會(huì )拒絕下載字體。與字處理器相比，CSS對字體并沒(méi)有提供更多的最終控制，別人加載你創(chuàng )建的一個(gè)Microsoft Office文檔時(shí)，其顯示可能取決于他已經(jīng)安裝的字體。如果他安裝的字體與你的字體不同，那么文檔看上去會(huì )大不相同。使用CSS設計的文檔也是如此。

涉及到各種繁雜的字體變形時(shí)，如粗體或斜體文本，字體命名的問(wèn)題就更是混亂。大多數人都知道，斜體文本看上去很像，但是很少有人能解釋它與傾斜文本有什么區別，甚至不知道二者之間存在區別。Slanted并不是斜體風(fēng)格（italic-style）文本唯一的別名，例如，你可能還會(huì )看到oblique、incline （或inclined）、cursive和kursiv等等字眼。因此，一種字體可能有一個(gè)Tinieslulic變形，而另一種字體可能使用GeorgiaOblique作為變形。盡管這兩種字體實(shí)際上就相當于Times和Georgia字體的“斜體形式”，但是它們的“稱(chēng)呼”有很大不同。類(lèi)似地，字體變形詞bold、black和heavy可能表示同一個(gè)意思，也可能不同。

CSS試圖為所有這些字體問(wèn)題提供一些解決機制，不過(guò)它不能提供一個(gè)全面的解決方案。CSS字體處理中最復雜的部分是字體系列（font-family）匹配和字體加粗（font-weight）匹配，其次是字體大?。╢ont-size）計算。CSS中與字體有關(guān)的方面還包括字體風(fēng)格（如斜體）和字體變形（如小型大寫(xiě)字母），相對而言，這些方面都比較直接。字體樣式的所有這些方面都集中到一個(gè)屬性，即font，本章后面將討論這個(gè)屬性。首先，先來(lái)討論字體系列，因為在為文檔選擇適當的字體時(shí)這是最基本的一步。

字體系列

前面討論過(guò)，實(shí)際上相同的字體可能有很多不同的稱(chēng)呼，不過(guò)CSS邁出了勇敢的一步，力圖幫助用戶(hù)代理把這種混亂狀況理清楚。畢竟，我們所認為的“字體”可能由許多字體變形組成，分別用來(lái)描述粗體、斜體文本，等等。例如，你可能已經(jīng)對字體Times很熟悉。不過(guò)，Times實(shí)際上是多種變形的一個(gè)組合，包括TimesRegular、TimesBold、 Timesltalic、TimesOblique、TimesBoldltalic, TimesBoIdOblique，等等。Times 的每種變形都是一個(gè)具體的字體風(fēng)格（font face），而我們通常認為T(mén)imes是所有這些變形字體的一個(gè)組合。換句話(huà)說(shuō)，Times實(shí)際上是一個(gè)字體系列（font family），而不只是單個(gè)的字體，盡管我們大多數人都認為字體就是某一種字體。

除了各種特定字體系列外（如Times, Verdana. Helvetica或Arial），CSS還定義了5種通用字體系列。

Serif 字體

這些字體成比例，而且有上下短線(xiàn)。如果字體中的所有字符根據其不同大小有不同的寬度，則稱(chēng)該字體是成比例的。例如，小寫(xiě)i和小寫(xiě)m的寬度就不同。上下短線(xiàn)是每個(gè)字符筆劃末端的裝飾，如小寫(xiě)/頂部和底部的短線(xiàn)，或大寫(xiě)A兩條“腿”底部的短線(xiàn)。serif 字體的例子包括Times' Georgia 和 New Century Schoolbook。

Sans-serif 字體

這些字體是成比例的，而且沒(méi)有上下短線(xiàn)。sans-serif字體的例子包括Helvetica、 Geneva、Verdana、Arial 和 Univers。

Monospace 字體

Monospace字體不是成比例的。它們通常用于模擬打字機打出的文本。老式點(diǎn)陣打印機的輸出，甚至更老式的視頰顯示終端。采用這些字體，每個(gè)字符的寬度都完全相同，所以小寫(xiě)的i與小寫(xiě)的m有相同的寬度。這些字體可能有上下短線(xiàn)，也可能沒(méi)有。如果一個(gè)字體的字符寬度完全相同，則歸類(lèi)為monospace字體，而不論是否有上下短線(xiàn)。monospace字體的例子包括Courier、Courier New和Andale Mono。

Cursive 字體

這些字體試圖模仿人的手寫(xiě)體。通常，它們主要由曲線(xiàn)和sedf字體中沒(méi)有的筆劃裝飾組成。例如，大寫(xiě)A在其左腿底部可能有一個(gè)小彎，或者完全由花體部分和小的彎曲部分組成，cursive字體的例子包括Zapf Chancery、Author和Comic Sans。

Fantasy 字體

這些字體無(wú)法用任何特征來(lái)定義，只有一點(diǎn)是確定的，那就是我們無(wú)法很容易地將其劃歸到任何一種其他的字體系列當中。這樣的字體包括Western、Woodblock和 Klingon。

理論上講，用戶(hù)安裝的任何字體系列都會(huì )落入到上述某種通用系列當中。但實(shí)際上可能并非如此，不過(guò)例外情況（如果有的話(huà)）往往很少。

使用通用字體系列

可以使用屬性font-family在文檔中采用上述任何字體系列。

font-family

值：

[[<family-name>|<generic-family>]，]* [<family-name> | <generic-family>] | inherit

初始值：

用戶(hù)代理指定的值

應用于：

所有元素

繼承性：

有

計算值：

根據指定確定

如果你希望文檔使用一種sans-serif字體，但是你并不關(guān)心是哪一種具體字體，以下就是

一個(gè)合適的聲明：

body {font-family: sans-serif;}

這樣用戶(hù)代理就會(huì )從sans-serif字體系列選擇一個(gè)字體（如Helvetica），并將其應用到body元素。因為有繼承，這種字體選擇還將應用到body元素中包含的所有元素，當然，除非有一種更特定的選擇器將其覆蓋。只使用這些通用系列（而不做其他指定），網(wǎng)頁(yè)設計師就能創(chuàng )建相當復雜的樣式表，以下規則的顯示見(jiàn)圖5-1所示：

body {font-family: serif;}

h1, h2, h3, h4 {font-family: sans-serif;}

code, pre, tt, span.input {font-family: monospace;}

p.signature {font-family: cursive;}

因此，文檔大部分會(huì )采用某種serif字體（包括大多數段落），如Times，但class為 signature的段落除外，這些段落會(huì )用一種cursive字體顯示，如Author。1~4級標題都采用sans-serif字體，如Helvetica，而元素code、pre,tt和span,input將使用某種monospace字體，如Courier很巧合，本書(shū)中的這些元素通常也正是這樣顯示的。

指定字體系列

另一方面，創(chuàng )作人員對于文檔或元素的顯示中使用何種字體可能有一些更特定的取向。類(lèi)似地，用戶(hù)也可能想創(chuàng )建一個(gè)用戶(hù)樣式表，定義所有文檔顯示中使用的具體字體。不論哪一種情況，還是要使用font-family屬性。

假設目前所有h1都應當使用Georgia字體。對此最簡(jiǎn)單的規則如下：

h1 {font-family: Georgia;}

這會(huì )使顯示文檔的用戶(hù)代理對所有h1都使用Georgia字體，如圖5-2所示。

當然，這個(gè)規則假設用戶(hù)代理上Georgia字體可用。如果Georgia字體不可用，用戶(hù)代理就根本不能使用這個(gè)規則。它不會(huì )忽略這個(gè)規則，但是如果無(wú)法找到一個(gè)名叫Georgia 的字體，它可能只能使用用戶(hù)代理的默認字體來(lái)顯示h1元素，除此以外什么也不做。

不過(guò)，不必萬(wàn)念俱灰。通過(guò)結合特定字體名和通用字體系列，可以創(chuàng )建與你預想的完全相同（或者至少很接近）的文檔。再來(lái)看前面的例子，以下標記告訴一個(gè)用戶(hù)代理使用Georgia（如果可用），如果Georgia字體不可用，則使用另外一種serif字體。

h1 {font-family: Georgia, serif;}

如果讀者沒(méi)有安裝Georgia字體，但是安裝了Times字體，用戶(hù)代理就可能對h1元素使用Times，盡管Times與Georgia并不完全匹配，但至少足夠接近。

處于這個(gè)原因，強烈建議在所有font-family規則中都提供一個(gè)通用字體系列。這樣一來(lái)，就提供了一條后路，在用戶(hù)代理無(wú)法提供與規則匹配的特定字體時(shí)，就可以選擇一個(gè)候選字體。這種候補策略很有幫助，因為在一個(gè)跨平臺環(huán)境中，將無(wú)法知道誰(shuí)安裝了什么字體。沒(méi)錯，世界上所有Windows機器都可能安裝了Arial和Times New Roman 字體，但是有些Macintosh并沒(méi)有（特別是較老的機器），Unix機器可能也是如此。相反地，盡管在所有現代Macintosh機器上都安裝了MarkerFelt和Charcoal，但Windows 和Unix用戶(hù)不太可能安裝其中某種字體，同時(shí)安裝這兩種字體的更是少之又少。以下是另外一些例子：

h1 {font-family: Arial, sans-serif;}

h2 {font-family: Charcoal, sans-serif;}

p {font-family: TimesNR, serif;}

address {font-family: Chicago, sans-serif;}

如果你對字體很熟悉，顯示一個(gè)給定元素時(shí)可能會(huì )想到很多類(lèi)似的字體。假設你希望一個(gè)文檔中的所有段落都使用Times顯示，不過(guò)也接受TimesNR、Georgia、New Century Schoolbook和New York （所有這些都是serif字體）。首先，先確定這些字體的優(yōu)先順序，然后用逗號把它們連起來(lái)：

p {font-family: Times, TimesNR,'New Century Schoolbook', Georgia,'New York'、serif;}

根據這個(gè)列表，用戶(hù)代理會(huì )按所列的順序查找這些字體。如果列出的所有字體都不可用，就會(huì )簡(jiǎn)單地選擇一種可用的serif字體。

使用引號

你可能注意到了，前面的例子中出現了單引號，這在以前沒(méi)有出現過(guò)。只有當一個(gè)字體名中有一個(gè)或多個(gè)空格（如New York），或者如果字體名包括#或$之類(lèi)的符號，才需要在font-family聲明中加引號。在這些情況下，整個(gè)字體名應當用引號括起，這樣用戶(hù)代理才能搞清楚字體名到底是什么（你可能認為有逗號就足夠了，但并非如此）。因此，名為Karrank%的字體就應當加引號：

h2 {font-family: Wedgie,'Karrank%', Klingon, fantasy;}

如果沒(méi)有引號，盡管規則的余下部分還會(huì )得到處理，但用戶(hù)代理有可能忽略這個(gè)特定的字體名。注意，根據CSS2.1規范，包含符號的字體名并不一定要加引號，但這是一種推薦做法，它類(lèi)似于CSS規范中描述的“最佳實(shí)踐”。類(lèi)似地，對包含空格的字體名也建議加引號?？梢钥吹?，唯一必須加引號的是與所接受關(guān)鍵字匹配的字體名。因此，如果需要一種名為“cursive”的字體，就必須加引號。

顯然，字體名中如果只包含一個(gè)詞，而且這個(gè)詞與font-family的任何關(guān)鍵字都不沖突，就不需要加引號，通用字體系列名（serif、monospace等等）在指示具體的通用系列時(shí)就不能加引號。如果將一個(gè)通用名用引號引起，用戶(hù)代理就會(huì )認為你需要一個(gè)與此同名的特定字體（例如，serif），而不是一個(gè)通用字體系列。

至于使用單引號還是雙引號，這兩種都是可以接受的。要記住，如果把一個(gè)font-family 規則放在style屬性中，則需要使用該屬性本身未曾使用的那種引號。因此，如果使用雙引號將font-family規則括起，就必須在規則內部使用單引號，如以下標記所示：

p {font-family: sans-serif;}/* sets paragraphs to sans-serif by default */

<!-- the next example is correct (uses single-quotes)-->

<p style="font-family:'New Century Schoolbook', Times, serif;">…</p>

<!-- the next example is NOT correct (uses double-quotes)-->

<p style="font-Family:"New Century Schoolbook", Times, serif;">...</p>