在 we 上應用字型是一項基本技術，同時也是一門藝術。對於英文本型來說可選擇的範圍實在是太廣泛了，合理的使用它們將會為你的**增色不少。
而真正的挑戰在於中文字型，由於中文字型組成的特殊性導致其體積過於龐大，除了作業系統內建的字型之外，我們很難在**上應用其他的字型。在可選性很差的前提之下，如何正確的使用中文字型呢?
首先，以下的字型宣告都是很糟糕的，切忌使用：
font-family: 「宋體」
font-family: 「宋體」，arial;
font-family: arial，」宋體」，」微軟雅黑」;
font-family: helvetica，arial，」華文細黑」，」微軟雅黑&rdquo
接下來，我們一步一步來說明如何定義好的字型宣告。
中文字型也有英文名稱
很多開發者忽略了這一點：儘管我們在作業系統中常常看到宋體、微軟雅黑、華文細黑這樣的字型名稱，但實際上這只是字型的顯示名稱，而不是字型檔案的名稱。雖然說在大多數情況下直接使用顯示名稱也有效，但有些使用者卻工作在一些很極端的情況下，這會導致你的字型宣告無效。
比如說，使用者安裝了中文版的作業系統(這意味著系統有中文字型)，但是卻切換到了以英文為主要語言——這種情況在那些希望加強英語鍛鍊的中文使用者當中是很常見的。這時候，作業系統很有可能無法按照顯示名稱找到正確的字型，所以我們要記住的第一件事情就是： 同時宣告中文字型的字型名稱(英文)和顯示名稱(中文)，就像這樣：
font-family: simsun, 「宋體」
font-family: 「microsoft yahei」, 「微軟雅黑」
font-family: stxihei, 「華文細黑」, 「microsoft yahei」, 「微軟雅黑」
永遠不要忘記宣告英文本型，並且英文本型應該在中文字型之前
記住這個事實：絕大部分中文字型裡包含英文本母(但是基本上都很醜)，而英文本型裡不包含中文字元。
在網頁裡中/英文混排是很常見的，你絕對不會喜歡用程式設計客棧中文字型顯示英文的效果，所以一定不要忘了先宣告英文本型：
font-family: georgia, simsun, 「宋體」
font-family: arial, 「microsoft yahei」, 「微軟雅黑」
另外還有乙個好習慣，就是在最後補充英文本型族的名稱。字型族大體上分為兩類：非襯線和襯線，它們之間的區別和使用規則請見本文開始介紹的**。一般來說，你應該這麼做：
font-family: georgia, simsun, 「宋體」, serif
font-family: arial, 「microsoft yahei」, 「微軟雅黑」, sans-serif
請注意：以上兩句宣告中的宋體和微軟雅黑不應該調換(儘管調換了也不會發生錯誤)，這是因為從字型的式樣來看，微軟雅黑是非襯線的，而宋體才是襯線的。然而中文並不像英文那樣嚴格區分字型族，所以這一點在實際應用當中並不那麼重要。
別忘了照顧不同的作業系統
作為乙個 web 開發者，你理應對 windows, mac os, linux 家族等常用作業系統裡的系統字型有足夠的了解，特別是中文。在這裡，我們假設目標**要同時給予 windows 使用者和 mac 使用者最好的字型體驗，於是我們可以這樣宣告：
font-family: helvetica, tahoma, arial, stxihei, 「華文細黑」, 「microsoft yahei」, 「微軟雅黑」, sans-serif
這句宣告都做到哪些事情呢?讓我們一一說明(括號內代表其對應的目標作業系統)：
對於英文本元，首先查詢helvetica(mac)，然後查詢tahoma(win)，都找不到就用arial(mac&win);若是以上三者都缺失，則使用當前預設的sans-serif字型(作業系統或瀏覽器指定);
對於中文字型，我們已經了解其規則了。華文細黑(mac)，微軟雅黑(win)是這兩個平台的預設中文字型。
注意向下相容
到此為止，我們的字型宣告已經很不錯了——如果你不必考慮還在使用舊版本作業系統的使用者的話。遺憾地是，中文市場還有大量的使用者在使用 windows xp，宋體才是他們的主要中文字型。為了照顧到這些使用者，你可以為微軟雅黑增加乙個 fallback：
font-family: helvetica, tahoma, arial, stxihei, 「華文細黑」, heiti, 「黑體」, 「microsoft yahei」, 「微軟雅黑」, simsun, 「宋體」, sans-serif
同樣地，你看到我們也為 mac 系統使用了黑體作為 fallback。
其他不加雙引號可以嗎?
可以。有些英文本型的名稱多於兩個單詞，因為單詞中間有空格所以需要用 "" 包裹起來。中文字型很特別，按照英文的角度來看，像微軟雅黑究竟算是乙個詞還是四個詞呢?沒關係，好在中文字型的名稱裡沒有空格，所以 "" 不加也沒什麼大礙。
不過，誰都不能保證在任何作業系統/瀏覽器環境下都是如此，若是發生了奇怪的事情，不妨加上雙引號試試看。
可以預設顯示某種字型嗎?比如微軟雅黑
你可能注意到了，在我們最後的字型宣告裡，華文細黑是預設字型(如果你的系統上安裝了宣告裡所有的中文字型的話)，為什麼我要先宣告 mac 系統的字型呢?
按理來說，大多數**的主要目標市場還是 windows 使用者的，所以理論上這個才是合理的宣告：
font-family: helvetica, tahoma, arial, 「microsoft yahei」, 「微軟雅黑」, simsun, 「宋體」, stxihei, 「華文細黑」, heiti, 「黑體」, sans-serif
但實際上卻並非如此。在中文字型的使用者群體裡，很大一部分擁有 mac 的人都同時安裝了 win 下常用的中文字型(這得歸功於 office for mac);但極少有 win 使用者去安裝 mac 下的中文字型.
因此，把 mac 用字型宣告在前面幾乎不會對 win 使用者產生什麼影響(因為他們壓根沒有!)，倒是用來做 fallback 的黑體可能會取代微軟雅黑的位置，所以更保險的做法或許是這樣：
font-family: helvetica, tahoma, arial, stxihei, 「華文細黑」, 「microsoft yahei」, 「微軟雅黑」, simsun, 「宋體」, heiti, 「黑體」, sans-serif
但無論如何請不要把微軟雅黑放在中文字型的最前面，作為史上最醜陋的中文字型之一，微軟雅黑實在不是什麼好的選擇，請照顧一下被 mac 寵壞的使用者吧，謝謝!(僅代表個人觀點)
btw，如果你也像我一樣不喜歡呆頭呆腦的微軟雅黑，那就乾脆把它刪了吧~
到此為止，雖然在我們的示例**裡沒有包含 linux 家族的例子，不過相信你也明白該怎麼做了吧。
一點補充
鑑於一些人對微軟雅黑的排位產生異議，我不妨把上文的解決方案再延伸一步。事實是這樣子的：
把微軟雅黑放前面，會導致安裝了微軟雅黑字型的 mac 使用者不得不面對微軟雅黑，而在 mac 下比微軟雅黑優雅得多的中文字型比比皆是;
把 mac 下的字型放前面，也會對 windows 使用者造成差不多的困惑，畢竟微軟雅黑是 windows 平台下顯示效果最好的字型(目前為止);
1 和 2，哪一種出現的概率更大一些?我想這是乙個不需要計算就能知道的答案吧?
但是——的確還有另外兩個因素在糾結著：
不少 windows 使用者因為各種原因關閉了 cleart程式設計客棧ype，在此情形下微軟雅黑將會慘不忍睹!但是 mac 的字型也不是好的選擇，真正的勝出者?猜對了，宋體。
絕大部分 mac 下的黑體在 windows 下模糊不清，而微軟雅黑雖然醜但在 mac 下至少能看。(間接體現了兩個平oimkg臺的字型渲染技術的差距)
所以在實踐中，真正接近」萬無一失」的方案需要考慮以下幾點：
利用 ua 判斷為不同的平台載入不一樣的字型宣告;
除非有特別的原因，否則盡量保持正文用宋體，標題和其他可以放大些的地方用微軟雅黑(針對 windows);
mac 下的冬青體效果極佳，但是該字型在 mac os x 10.6 以前是沒有的，所以謹慎考慮你的使用者群體，或者使用華文黑體系列做 fallback;
最後，我不想再和任何人爭論字型的優劣，本文的目的是介紹使用方法而不是字型選擇。」美」或」醜」向來都是很主觀的事情，只因為我是作者，所以我免不了會有傾向性，然而我也相信你自己會有正確的判斷，和我較真沒有任何實際意義。
本文標題: web中文字型應用指南
本文位址:
推薦！Web中文字型應用指南
原文出處 新手入門 選擇字型的五個原則 中英文基本字形的演變和發展 2012年度最佳移動網頁字型設計 推薦！跨平台字型效果 而真正的挑戰在於中文字型，由於中文字型組成的特殊性導致其體積過於龐大，除了作業系統內建的字型之外，我們很難在 上應用其他的字型。在可選性很差的前提之下，如何正確的使用中文字型呢...
CSS教程 網頁英文本型和中文字型應用
在西方國家的字母體系，分成兩大字族 serif 及 sans serif。其中 typewriter 打字機字型，雖然也是 sans serif，但由於他是等距字，所以另獨立出乙個 typewriter 字族出來。serif 的意思是，在字的筆畫開始及結束的地方有額外的裝飾，程式設計客棧而且筆畫的粗...
linux中文字型
背景說明 報表，在windows下，展現 匯出都正常，在linux下，字型變大了。比如，單元格的大小設計好後，裡面的字當好能一行顯示完，將報表放到linux下後，字變大了，一行顯示不完了，變成了兩行，這樣會影響我們報表的美觀。出現這樣的問題，是什麼原因呢？我們又怎麼解決呢？看下面的原因和方法。應用舉...