字體家族屬性的語法
版式設計是成功網站設計中極為重要的一部分。 使用易於閱讀和看起來很棒的文字創建網站是每個網頁設計專業人員的目標。 為了達到這個目的，你需要能夠設置你想要在你的網頁上使用的特定字體。 要在Web文檔中指定字體或字體系列，您將在CSS中使用font-family樣式屬性。
您可以使用的最簡單的字體家族風格只包括一種字體系列：
p {font-family：Arial; }如果將此樣式應用於頁面，則所有段落都將顯示在“Arial”字體系列中。 這很好，因為“Arial”是所謂的“網絡安全字體”，這意味著大多數（如果不是全部的話）計算機將安裝它，您可以很容易地知道您的頁面將以預期的字體顯示。
那麼如果你選擇的字體找不到，會發生什麼？ 例如，如果您不在頁面上使用“網頁安全字體”，那麼用戶代理在沒有該字體時會執行什麼操作？ 他們進行替代。
這可能會導致一些非常有趣的頁面。 我曾經去過一個頁面，在那裡我的電腦完全在“Wingdings”（一個圖標集）中顯示它，因為我的電腦沒有開發者指定的字體，而且我的瀏覽器在它的字體上做出了非常糟糕的選擇用作替代品。 該頁面對我來說完全不可讀！ 這是字體堆棧的作用。
用字體堆棧中的逗號分隔多個字體系列
“字體堆棧”是您希望頁面使用的字體列表。 您可以按照您的偏好設置字體選項，並用逗號分隔各個字體。 如果瀏覽器沒有列表上的第一個字體系列，它將嘗試第二個，然後第三個，直到它找到它在系統上的一個。
font-family：Pussycat，阿爾及利亞人，百老匯;在上面的例子中，瀏覽器將首先查找“Pussycat”字體，然後查找“阿爾及利亞”，然後是“百老匯”，如果沒有找到其他字體。 這給了你至少一個你選擇的字體將被使用的機會。 這並不完美，這就是為什麼我們還有更多的東西可以添加到我們的字體堆棧中（繼續閱讀！）。
最後使用通用字體
所以你可以創建一個帶有字體列表的字體堆棧，但瀏覽器仍然沒有找到。 如果瀏覽器做出了糟糕的替代選擇，你顯然不希望自己的頁面顯示不可讀。 幸運的是，CSS也有一個解決方案： 通用字體 。
您應該始終使用通用字體來結束您的字體列表（即使它是一個家庭列表或僅限Web安全字體）。 有五個你可以使用：
- 草書
- 幻想
- 等寬
- 無襯線字體
- 襯線
以上兩個示例可能會更改為：
font-family：Arial，sans-serif; 字體家族：Pussycat，阿爾及利亞，百老匯，幻想;某些字體家族名稱是兩個或更多字
如果您要使用的字體系列不只一個字，那麼您應該用雙引號括起來。 雖然有些瀏覽器可以在不帶引號的情況下讀取字體系列，但如果空白字符被壓縮或忽略，則可能會出現問題。
font-family：“Times New Roman”，serif;在這個例子中，你可以看到字體名稱為“Times New Roman”，它是多字的，用引號括起來。 這告訴瀏覽器，這三個單詞都是該字體名稱的一部分，而不是三種不同的字體，都是單字的名稱。
Jennifer Krynin的原創文章。 由Jeremy Girard在12/2/16編輯