| 中文名 | 英文名 | Unicode | Unicode 2 |
|---|---|---|---|
| Mac OS | |||
| 華文細黑 | STHeiti Light [STXihei] | \534E\6587\7EC6\9ED1 | 華文細黑 |
| 華文黑體 | STHeiti | \534E\6587\9ED1\4F53 | 華文黑體 |
| 華文楷體 | STKaiti | \534E\6587\6977\4F53 | 華文楷體 |
| 華文宋體 | STSong | \534E\6587\5B8B\4F53 | 華文宋體 |
| 華文仿宋 | STFangsong | \534E\6587\4EFF\5B8B | 華文仿宋 |
| 麗黑 Pro | LiHei Pro Medium | \4E3D\9ED1 Pro | 麗黑 Pro |
| 麗宋 Pro | LiSong Pro Light | \4E3D\5B8B Pro | 麗宋 Pro |
| 標楷體 | BiauKai | \6807\6977\4F53 | 標楷體 |
| 蘋果麗中黑 | Apple LiGothic Medium | \82F9\679C\4E3D\4E2D\9ED1 | 蘋果麗中黑 |
| 蘋果麗細宋 | Apple LiSung Light | \82F9\679C\4E3D\7EC6\5B8B | 蘋果麗細宋 |
| Windows | |||
| 新細明體 | PMingLiU | \65B0\7EC6\660E\4F53 | 新細明體 |
| 細明體 | MingLiU | \7EC6\660E\4F53 | 細明體 |
| 標楷體 | DFKai-SB | \6807\6977\4F53 | 標楷體 |
| 黑體 | SimHei | \9ED1\4F53 | 黑體 |
| 宋體 | SimSun | \5B8B\4F53 | 宋體 |
| 新宋體 | NSimSun | \65B0\5B8B\4F53 | 新宋體 |
| 仿宋 | FangSong | \4EFF\5B8B | 仿宋 |
| 楷體 | KaiTi | \6977\4F53 | 楷體 |
| 仿宋_GB2312 | FangSong_GB2312 | \4EFF\5B8B_GB2312 | 仿宋_GB2312 |
| 楷體_GB2312 | KaiTi_GB2312 | \6977\4F53_GB2312 | 楷體_GB2312 |
| 微軟正黑體 | Microsoft JhengHei | \5FAE\x8F6F\6B63\9ED1\4F53 | 微軟正黑體 |
| 微軟雅黑 | Microsoft YaHei | \5FAE\8F6F\96C5\9ED1 | 微軟雅黑 |
| Office | |||
| 隸書 | LiSu | \96B6\4E66 | 隸書 |
| 幼圓 | YouYuan | \5E7C\5706 | 幼圓 |
| 華文細黑 | STXihei | \534E\6587\7EC6\9ED1 | 華文細黑 |
| 華文楷體 | STKaiti | \534E\6587\6977\4F53 | 華文楷體 |
| 華文宋體 | STSong | \534E\6587\5B8B\4F53 | 華文宋體 |
| 華文中宋 | STZhongsong | \534E\6587\4E2D\5B8B | 華文中宋 |
| 華文仿宋 | STFangsong | \534E\6587\4EFF\5B8B | 華文仿宋 |
| 方正舒體 | FZShuTi | \65B9\6B63\8212\4F53 | 方正舒體 |
| 方正姚體 | FZYaoti | \65B9\6B63\59DA\4F53 | 方正姚體 |
| 華文彩雲 | STCaiyun | \534E\6587\5F69\4E91 | 華文彩雲 |
| 華文琥珀 | STHupo | \534E\6587\7425\73C0 | 華文琥珀 |
| 華文隸書 | STLiti | \534E\6587\96B6\4E66 | 華文隸書 |
| 華文行楷 | STXingkai | \534E\6587\884C\6977 | 華文行楷 |
| 華文新魏 | STXinwei | \534E\6587\65B0\9B4F | 華文新魏 |
在Web編碼中，CSS默認應用的Web字體是有限的，雖然在新版本的CSS3，咱們能夠經過新增的@font-face屬性來引入特殊的瀏覽器加載字體。css3
但多數狀況下，考慮各個因素的影響咱們仍是在儘可能充分利用這些默認調用的字體實現CSS的編寫，這裏整理了20個Web安全字體，讓你無需任何顧慮的狀況下暢快使用。程序員
1, Arialwindows
微軟公司的網頁核心字體之一，最經常使用的sans serif字體，當字號很小時不容易閱讀。可是，大寫的「I」和小寫的「l」是沒法區別的，你能夠考慮用Tahoma字體來替代。
（蘋果系統沒有這種字體，但有一種對應於Arial的字體叫Helvetica，它是MAC機上與Arial 字體最類似的WEB字體,是別一種非襯線字體.它是一種性能優良的打印字體,但在屏幕上表現不是很好，說道Helvetica字體，昨天發現了不少有意思的站點，主要是記念Helvetica字體誕生50年而設的。）瀏覽器
CSS寫法：font-family: Arial, Helvetica, sans-serif;安全
2, Arial Black性能
CSS寫法：font-family: ‘Arial Black’, Gadget, sans-serif;字體
3, Arial Narrow網站
CSS寫法：font-family: ‘Arial Narrow’, sans-serif;編碼
4, Verdana
微軟公司的網頁核心字體之一，微軟公司專門爲屏幕顯示而開發的。應用普遍。易於閱讀。是顯示器中最清晰的字體，即便字號很小，也很容易閱讀。半肥貓比較喜歡採用10PX的Verdana來作英文正文字體，也推薦你們使用，但字號最好介於10~14像素之間，超出這個範圍就很差看了。
CSS寫法：font-family: Verdana, Geneva, sans-serif;
5, Georgia
微軟公司的網頁核心字體之一，可用性好。可讀性比Times New Roman強。是網站設計中，瀏覽效果最好的serif字體，由於它是專爲網上閱讀設計的。）
CSS寫法：font-family: Georgia, serif;
6, Times New Roman
微軟公司的網頁核心字體之一，多是最經常使用的serif字體，是網站瀏覽器默認的字體，12pt以上的字體容易閱讀，但小字號的字體易讀性差。（蘋果系統沒有這個字體，有一個對應於Times New Roman的字體叫Times）
CSS寫法：font-family: 'Times New Roman', Times, serif;
7, Trebuchet MS
微軟公司的網頁核心字體之一，與Arial類似，半肥貓以爲：Trebuchet MS比Arial看起來優雅、古典一點。能夠用來作標題，但小字號閱讀起來會很困難（低於13PIX閱讀起來就很累了，不太推薦用來作正文字體）。在蘋果系統上也能夠用Helvetica作替代。
CSS寫法：font-family: 'Trebuchet MS', Helvetica, sans-serif;
8 , Courier New
微軟公司的網頁核心字體之一，老式打印機字體，有一種獨特的機械工整感受。呈現計算機編碼時，還會用到這種字體。12 pt的Courier New字體曾是美國國務院的公文標準字體，但於2004年1月停用，改使用14 pt的Times New Roman，由於其具「現代性」和「易讀性」。
CSS寫法：font-family: 'Courier New', Courier, monospace;
9, Impact
微軟公司的網頁核心字體之一，Impact是1965年發表的一個無襯線字體，其特粗的筆畫、緊縮的間距。半肥貓以爲：字體較爲粗獷，適合使用在標題上，而不經常使用在內文。
CSS寫法：font-family: Impact, Charcoal, sans-serif;
10, Comic Sans MS
微軟公司的網頁核心字體之一，手寫體。這是一種爭議很大的字體，講實話，半肥貓也不喜歡這個字體，一點美感都沒有，不過在一大堆規規矩矩的字體裏面，有這麼一個隨意性比較的字體，能夠變換一下口味，也算不錯吧，建議不要用在正規的金融、政府、商業機構站點。
CSS寫法：font-family: 'Comic Sans MS', cursive;
11, Tahoma
Tahoma是一個十分常見的無襯線字體，Tahoma和Verdana師出同爲名設計師馬修·卡特的做品，由微軟在1999年推出，被採用爲Windows 2000、Windows XP、Windows Server 2003等系統的默認字型。半肥貓以爲：它的字體結構和Verdana很類似，其字符間距較小，用來做爲標題，效果好過Arial（Tahoma的大寫I 和小寫l比Arial容易識別），但若是做爲正文，他的字號不能小於13PIX，不然不少筆畫粘連到一塊兒，不利於閱讀。
CSS寫法：font-family: Tahoma, Geneva, sans-serif;
12, Courier
Courier是一個等寬字體的粗襯線字體，主要是依據打字機所打印出來的字型來設計。原來Courier New的字體是IBM公司在1950年代設計給打印機使用的字體，後來這個字型成爲整個打字機制造業的標準。Courier New是Courier的變體，比Courier更具機械味道。
CSS寫法：font-family: Courier, monospace;
13, Lucida Sans Unicode
是一種OpenType型的無襯線字體 。1993年製做並隨微軟公司的Windows NT 3.1操做系統發佈。有較大的x字高，具備很好的可讀性，被普遍用於顯示、出版等各類用途。
它支持Unicode2.0版本的基本字符，包括拉丁字母，希臘字母，西裏爾字母，希伯來字母，以及國際音標字符。該字體是首個 Unicode代碼的字體， 該字體從Windows 98開始一直做爲系統預裝字體發行。
後來發佈的 Lucida Grande字體做爲蘋果公司Mac OS X系統的默認字體發佈。
CSS寫法：font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
14, Lucida Console
同Lucida Sans Unicode相似。
CSS寫法：font-family: 'Lucida Console', Monaco, monospace;
15, Garamond
Garamond（加拉蒙德）是一類西文襯線字體的總稱，自16世紀40年代開始至今，有不少家公司和不少設計師參與到Garamond字體設計，如： Adobe Garamond, Monotype Garamond, Sioncini Garamond，和 Stempel Garamond等等。半肥貓以爲：字體給人端莊典雅，有些古典的感受，在博物館和歷史性悠久的項目中使用，應該能夠得到不錯的效果。
CSS寫法：font-family: Garamond, serif;
16 , MS Sans Serif
微軟系統自帶字體。屏幕顯示的像素字體。非襯線字體。
CSS寫法：font-family: 'MS Sans Serif', Geneva, sans-serif;
17 , MS Serif
微軟系統自帶字體。屏幕顯示的像素字體。襯線字體。
CSS寫法：font-family: 'MS Serif', 'New York', sans-serif;
18, Palatino Linotype
CSS寫法：font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
19, Symbol
CSS寫法：font-family: Symbol, sans-serif;
20, Bookman Old Style
CSS寫法：font-family: 'Bookman Old Style', serif;
本文參考了WEB安全字體，但願在Web編寫過程當中這些核心的Web字體能對你有用。
總結幾套實用而簡單的font-family
Tahoma 系的中性字體。推薦使用在13px以上的環境。
Verdana 系的寬扁字體。推薦在11px如下環境使用。
襯線字體的不二之選。
一系列等寬字體。寫代碼很好用。另外，若是以爲Lucida Console太寬的話，能夠換成比較窄的Lucida Sans Typewriter。話說老趙blog上的代碼塊使用的就是Lucida Sans Typewriter 喲~
- 你知道嗎？
- 字體的別名
系統中的一個字體是容許有多種別名形式存在的。好比，在windows 下，Georgia 也能夠用 Georgia MS 來命名，它們實際上是同一種字體。宋體的正式名稱是SimSon，而"宋體"只是它的別名。
按照規範，瀏覽器應該能自動識別字體的別名，並映射到正確的字體文件。好比，font-famliy: SimSon 和 font-family: "宋體" 應該具備等價的效果。惋惜，彷佛不少瀏覽器都不能正確執行前一條定義……
- 何時在字體名稱前面加引號
你們來看這個字體樣式定義：
font-family: Times New Roman, 宋體, serif;不少人都會說，這個樣式寫法是錯的，由於 Times New Roman 和宋體都應該用引號括起來，像下面這樣：
font-family: "Times New Roman", "宋體", serif;實際上呢，上面兩種寫法都是對的。和不少人想象中的不同，字體名稱外面的引號其實並不是必須的。那麼加引號和不加引號有什麼區別呢？
其實最大的不一樣在於對字體名稱中空白字符（如空格、製表符）的解釋。
不加引號的時候，瀏覽器對於字體名稱中空白字符的解釋應該和XML中同樣，即忽略字體名稱左右的空白字符，而且單詞中間的空白字符被解釋爲一個空格。好比 font-family: Times New Roman , serif; 會被解釋成 font-family: Times New Roman, serif;
加引號的時候，瀏覽器必須保留引號內全部的空白字符。若是寫成 font-family: "Times New Roman"; 那麼瀏覽器不會顯示 Times New Roman 字體，而是搜索一個叫作"Times New Roman"的字體。
至 於"宋體"這樣的字體名稱，由於中間沒有空白字符，所以徹底沒有必要加引號。可是考慮到並不是左右的操做系統都有漢字支持，而且並不是全部的程序員都會注意 css文件的正確編碼問題，全部保險起見，通常會加上引號。固然，解決這種問題的最好方法是使用別名。好比宋體，其實應該寫成SimSon，這樣哪怕瀏覽 者的系統不支持中文，而且這個css文件被錯誤的編碼成了GB2132也沒問題，瀏覽器仍是知道這是宋體，而且作出正確的字體搜索。惋惜，不是全部瀏覽器 都支持就是了……