CSS 字體系列
- 通用字體
- Serif 字體
- Sans-serif 字體
- Monospace 字體
- Cursive 字體
- Fantasy 字體
font-family 定義文本的字體系列。
body {font-family: sans-serif;}
組合字體
h1 {font-family: Georgia, serif;}
通過結(jié)合特定字體名和通用字體系列來解決沒有安裝 Georgia 字體，使用默認(rèn)字體
字體風(fēng)格
font-style最常用于規(guī)定斜體文本。
該屬性有三個值：
- normal - 文本正常顯示
- italic - 文本斜體顯示
- oblique - 文本傾斜顯示
斜體（italic）是一種簡單的字體風(fēng)格，對每個字母的結(jié)構(gòu)有一些小改動，來反映變化的外觀。與此不同，傾斜（oblique）文本則是正常豎直文本的一個傾斜版本。
通常情況下，italic 和 oblique 文本在 web 瀏覽器中看上去完全一樣。
字體變形
font-variant 屬性可以設(shè)定小型大寫字母。報紙首字母特別大。
p {font-variant:small-caps;}
字體加粗font-weight
使用 bold 關(guān)鍵字可以將文本設(shè)置為粗體。
關(guān)鍵字 100 ~ 900 為字體指定了 9 級加粗度。如果一個字體內(nèi)置了這些加粗級別，那么這些數(shù)字就直接映射到預(yù)定義的級別，100 對應(yīng)最細(xì)的字體變形，900 對應(yīng)最粗的字體變形。數(shù)字 400 等價于 normal，而 700 等價于 bold。
如果將元素的加粗設(shè)置為 bolder，瀏覽器會設(shè)置比所繼承值更粗的一個字體加粗。與此相反，關(guān)鍵詞 lighter 會導(dǎo)致瀏覽器將加粗度下移而不是上移。
p.normal {font-weight:normal;}
p.thick {font-weight:bold;}
p.thicker {font-weight:900;}
字體大小font-size
請始終使用正確的 HTML 標(biāo)題，比如使用 <h1> - <h6> 來標(biāo)記標(biāo)題，使用 <p> 來標(biāo)記段落。
- 像素px來設(shè)置字體大小
h1 {font-size:60px;}
h2 {font-size:40px;}
p {font-size:14px;}
- em 來設(shè)置字體大小 1em=16px
h1 {font-size:3.75em;} /* 60px/16=3.75em */
h2 {font-size:2.5em;} /* 40px/16=2.5em */
p {font-size:0.875em;} /* 14px/16=0.875em */
- 結(jié)合使用百分比和 EM
在所有瀏覽器中均有效的方案是為 body 元素（父元素）以百分比設(shè)置默認(rèn)的 font-size 值：
實(shí)例
body {font-size:100%;}
h1 {font-size:3.75em;}
h2 {font-size:2.5em;}
p {font-size:0.875em;}
