CSS的字體屬性定義字體，氣魄，大小和文本的樣式。
差異襯線和無襯線字體之間
CSS字體家庭
在CSS中，有兩種類型的字體家族名的：
- 一般的家庭 -一組字體系列具有相似的外觀（如“襯線”或“等寬字體”）
- 字體家族 -一個特定的字體系列（如“宋體”或“宋體”）
| Generic family | Font family | Description |
|---|---|---|
| Serif | Times New Roman Georgia |
Serif fonts have small lines at the ends on some characters |
| Sans-serif | Arial Verdana |
"Sans" means without - these fonts do not have the lines at the ends of characters |
| Monospace | Courier New Lucida Console |
All monospace characters have the same width |
 | 注意：在計算機屏幕，無襯線字體被認為是更容易比serif字體閱讀。 |
|---|
字體系列
文本的字體系列設置與font-family財產。
該font-family屬性應該持有多種字體的名稱為“回退”制度。 如果該瀏覽器不支持的第一個字體，則嘗試下一個字體，等等。
開始你想要的字體，與通用終結於家庭，讓瀏覽器選擇一個相似的字體在通用家族，如果沒有其他的字體可用。
注意 ：如果字體家族的名稱是多個單詞，則必須用引號引起來，如：“宋體”。
不止一個字體家族是一個逗號分隔的列表中指定的：
對於常用的字體組合，看看我們的網頁安全字體組合 。
字體樣式
該font-style屬性主要用於指定斜體文本。
這個屬性有三個值：
- 正常 - 該文本是正常顯示
- 斜體 - 該文本以斜體顯示
- 斜 - 該文本是“傾斜”（斜非常相似，斜體，但不支持）
例
p.normal {
font-style: normal;
}
p.italic {
font-style: italic;
}
p.oblique {
font-style: oblique;
} 試一試» 字體大小
在font-size屬性設置文本的大小。
能夠管理文本大小是在網頁設計中很重要的。 但是，你不應該使用的字體大小調整，使段落看起來像標題，或標題看起來像段落。
始終使用正確的HTML標記，像<H1> - <H6>的標題和<p>的段落。
字體大小值可以是絕對或相對尺寸。
絕對規模：
- 設置文本到指定尺寸
- 不允許用戶更改文字大小在所有瀏覽器（壞的無障礙原因）
- 當輸出的物理尺寸是已知的絕對大小是有用
相對大小：
- 相對於周圍的元素的大小設置
- 允許用戶改變瀏覽器中的文本大小
| 注意：如果不指定字體大小，正常文字的默認大小，如段落，是16像素（16像素= 1EM）。 |
|---|
設置字體大小隨著像素
設置與像素的文本大小為您提供了文本大小完全控制：
提示：如果您使用的像素，你仍然可以使用縮放工具來調整整個頁面。
設置字體大小的EM
為了讓用戶調整文本（在瀏覽器菜單），許多開發人員使用EM而不是像素。
的青黴大小單位由W3C推薦。
1em的是等於當前字體大小。 在瀏覽器的默認字體大小為16像素。 因此，1EM的默認大小為16像素。
像素/ 16 =青黴：大小可以從使用此公式的像素青黴計算
例
h1 {
font-size: 2.5em; /* 40px/16=2.5em */
}
h2 {
font-size: 1.875em; /* 30px/16=1.875em */
}
p {
font-size: 0.875em; /* 14px/16=0.875em */
} 試一試» 在上面的例子中，在電磁文本大小是相同的像素前面的例子。 然而，隨著新興市場的大小，也可以在所有瀏覽器調整文字的大小。
不幸的是，仍與舊版本的IE的一個問題。 文本變得比它應該何時作出小於它應該何時作出更大更大和更小。
使用百分比和EM的組合
在所有瀏覽器上運行的解決方案，以百分比設置默認字體大小為<body>元素：
例
body {
font-size: 100%;
}
h1 {
font-size: 2.5em;
}
h2 {
font-size: 1.875em;
}
p {
font-size: 0.875em;
} 試一試» 我們的代碼現在的偉大工程！ 它顯示在所有瀏覽器相同的文字大小，並允許所有的瀏覽器來放大或調整的文字！
字體粗細
該font-weight屬性指定字體的粗細：
字體變
的font-variant屬性指定是否文本應以小型大寫字體顯示。
在一個小型大寫字體，所有小寫字母轉換為大寫字母。 然而，轉換大寫字母出現在較小的字體大小比在文本原始大寫字母。
更多示例
在一個聲明中的所有字體屬性
這個例子演示了如何使用簡寫屬性來設置所有的字體屬性在一個聲明。
自測練習用！
所有的CSS字體屬性
| Property | Description |
|---|---|
| font | Sets all the font properties in one declaration |
| font-family | Specifies the font family for text |
| font-size | Specifies the font size of text |
| font-style | Specifies the font style for text |
| font-variant | Specifies whether or not a text should be displayed in a small-caps font |
| font-weight | Specifies the weight of a font |