客專家福利 有獎試讀&征文——我們在互聯網上奮斗的故事 10月推薦文章匯總 加入“技術熱心人”,贏豐厚獎品
在CSS中使用中文字體通常直接設置字體名稱,比如設置字體為宋體:font-family:’宋體’。但因此產生的一個問題是,如果CSS編碼有誤,會導致頁面加載后CSS中的中文字體亂碼
直接使用中文字體,有時候在ie6下會出現樣式丟失問題。
而使用英文代替中文如:“font-family:SimSun”也不推薦,Firefox的部分版本與Opera在處理SimSun時會有問題。
所以推薦使用中文字體的Unicode編碼。
那怎么解決這個亂碼問題呢,由於CSS文件基本都是UTF-8的編碼模式,所以我們可以把中文字體的名稱用相應的Unicode編碼來代替,這樣就可以有 效的避免瀏覽器解釋CSS代碼時候出現亂碼的問題。比如中文字體“宋體”經過Unicode編碼后為“\5b8b\4f53″,在CSS中就可以這樣 寫:font-family:’ \5b8b\4f53’;
如果在你“DIV+CSS”的過程中,還需要用到一些表中沒有的字體的話,可以借助Firefox的插件Firebug來查詢所需中文字體對應的 Unicode編碼,方法很簡單,就是打開Firefox,然后打開Firebug,在“控制台”里底部“>>>”的后面像這樣輸入
escape('黑體');
escape('黑體');
escape('黑體');
escape('黑體');
escape('黑體');escape('微軟雅黑');,然后會顯示一個信息,%u5FAE%u8F6F%u96C5%u9ED1這個就是中文字體“微軟雅黑”對應的Unicode編碼“\5FAE\8F6F\96C5\9ED1”,注意把%u改成\,否則可能會出錯。
巧用Firebug查詢中文字體的Unicode編碼(Firefox 14.0.1,Firebug 1.10.1)
另外,在設置字體時候最好把英文字體寫在前面,不然可能網頁里所有的英文字體和數字都變成“宋體”或者別的字體去了,那樣看起來比較不美觀。例 如:font-family:’ \5FAE\8F6F\96C5\9ED1’,Arial;最好像這樣寫:font-family:’\5FAE\8F6F\96C5 \9ED1’,Arial;
為了方便需要的朋友快速使用,下表中列出了一些常用中文字體的Unicode編碼:
宋體 SimSun \5B8B\4F53
黑體 SimHei \9ED1\4F53
微軟雅黑 Microsoft YaHei \5FAE\8F6F\96C5\9ED1
微軟正黑體 Microsoft JhengHei \5FAE\x8F6F\6B63\9ED1\4F53
新宋體 NSimSun \65B0\5B8B\4F53
新細明體 PMingLiU \65B0\7EC6\660E\4F53
細明體 MingLiU \7EC6\660E\4F53
標楷體 DFKai-SB \6807\6977\4F53
仿宋 FangSong \4EFF\5B8B
楷體 KaiTi \6977\4F53
仿宋_GB2312 FangSong_GB2312 \4EFF\5B8B_GB2312
楷體_GB2312 KaiTi_GB2312 \6977\4F53_GB2312
華文細黑 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 LiSong Pro Light \4E3D\5B8B Pro
標楷體 BiauKai \6807\6977\4F53
蘋果麗中黑 Apple LiGothic Medium \82F9\679C\4E3D\4E2D\9ED1
蘋果麗細宋 Apple LiSung Light \82F9\679C\4E3D\7EC6\5B8B