字體，我們經常見到，在word的使用中，我們往往會使用不同的字體，什麼宋體、微軟雅黑等。在CSS中，使用font-family屬性來定義字體類型。
語法：
font-family：字體1,字體2,字體3;
說明：
font-family可指定多種字體，多個字體將按優先順序排列，以逗號隔開，注意逗號一定要是英文逗號。
舉例1：
在線測試
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>font-family屬性</title>
<style type="text/css">
#p1{font-family:宋體;}
#p2{font-family:微軟雅黑;}
</style>
</head>
<body>
<p id="p1">字體為宋體</p>
<p id="p2">字體為微軟雅黑</p>
</body>
</html>
在浏覽器預覽效果如下：
舉例1：
在線測試
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>font-family屬性</title>
<style type="text/css">
p{font-family:微軟雅黑,Arial,Times New Roman;}
</style>
</head>
<body>
<p> 學習網，讓這裡的一切成為襯托你成功的 。</p>
</body>
</html>
在浏覽器預覽效果如下：
分析：
對於“p{font-family:微軟雅黑,宋體,Times New Roman;}”這句代碼，初學者可能會覺得很疑惑。為什麼要為元素同時定義多個字體呢？
其實原因是這樣的：每個人的電腦裝的字體都不一樣，我們定義“p{font-family:微軟雅黑,Arial,Times New Roman;}”這句的意思是，p元素優先用“微軟雅黑”字體來顯示，如果你的電腦沒有裝“微軟雅黑”這個字體，那接著就用“Arial”字體來顯示，如果也沒有裝“Arial”字體，接著就用“Times New Roman”字體來顯示，以此類推。
否則，如果你只定義“p{font-family:微軟雅黑;}”的話，如果你的電腦沒有裝“微軟雅黑”字體，p元素就直接用浏覽器默認的“宋體”字體來顯示了，達不到你預期的效果。
默認情況下，浏覽器的字體是宋體。中文字體常用的有宋體、微軟雅黑，英文字體比較常用的是Times New Roman、Arial。
在CSS進階教程中，我們會更深入講解字體類型。