中文字體在CSS中的表達(dá)方式
在寫(xiě)一個(gè)網(wǎng)站的樣式表的時(shí)候,都會(huì)不可避免地用到一些中文字體,比如說(shuō)微軟雅黑、黑體等,除非是做英文站,或者說(shuō)你樂(lè)意整站都用瀏覽器默認(rèn)的字體, 那我也算服了U。在 CSS 中寫(xiě)入中文字體的方法一般采用 font-family:"微軟雅黑","黑體";這樣類似的表達(dá)方式,但是對(duì)于像 WordPress 這樣需要 UTF8 編碼平臺(tái)來(lái)說(shuō),一個(gè)不注意沒(méi)有轉(zhuǎn)換編碼就會(huì)導(dǎo)致中文字體無(wú)法按照希望的字體表形出來(lái)。所以我們可以通過(guò)英文、unicode 這種形式來(lái)表達(dá)中文,比如說(shuō)剛才的 font-family:"微軟雅黑","黑體";就可以寫(xiě)成 font-family:"Microsoft Yahei","SimHei"; 這樣看起來(lái)是不是也可以統(tǒng)一一點(diǎn)呢。
中文字體與英文、unicode 對(duì)應(yīng)的太多,背也背不下來(lái),就搜集了一張表格收藏記錄一下,希望也是你想要的:
中文名 | 英文名 | Unicode |
---|---|---|
Mac OS | ||
華文細(xì)黑 | STHeiti Light [STXihei] | 534E65877EC69ED1 |
華文黑體 | STHeiti | 534E65879ED14F53 |
華文楷體 | STKaiti | 534E658769774F53 |
華文宋體 | STSong | 534E65875B8B4F53 |
華文仿宋 | STFangsong | 534E65874EFF5B8B |
麗黑 Pro | LiHei Pro Medium | 4E3D9ED1 Pro |
麗宋 Pro | LiSong Pro Light | 4E3D5B8B Pro |
標(biāo)楷體 | BiauKai | 680769774F53 |
蘋(píng)果麗中黑 | Apple LiGothic Medium | 82F9679C4E3D4E2D9ED1 |
蘋(píng)果麗細(xì)宋 | Apple LiSung Light | 82F9679C4E3D7EC65B8B |
Windows | ||
新細(xì)明體 | PMingLiU | 65B07EC6660E4F53 |
細(xì)明體 | MingLiU | 7EC6660E4F53 |
標(biāo)楷體 | DFKai-SB | 680769774F53 |
黑體 | SimHei | 9ED14F53 |
宋體 | SimSun | 5B8B4F53 |
新宋體 | NSimSun | 65B05B8B4F53 |
仿宋 | FangSong | 4EFF5B8B |
楷體 | KaiTi | 69774F53 |
仿宋_GB2312 | FangSong_GB2312 | 4EFF5B8B_GB2312 |
楷體_GB2312 | KaiTi_GB2312 | 69774F53_GB2312 |
微軟正黑體 | Microsoft JhengHei | 5FAEx8F6F6B639ED14F53 |
微軟雅黑 | Microsoft YaHei | 5FAE8F6F96C59ED1 |
Office | ||
隸書(shū) | LiSu | 96B64E66 |
幼圓 | YouYuan | 5E7C5706 |
華文細(xì)黑 | STXihei | 534E65877EC69ED1 |
華文楷體 | STKaiti | 534E658769774F53 |
華文宋體 | STSong | 534E65875B8B4F53 |
華文中宋 | STZhongsong | 534E65874E2D5B8B |
華文仿宋 | STFangsong | 534E65874EFF5B8B |
方正舒體 | FZShuTi | 65B96B6382124F53 |
方正姚體 | FZYaoti | 65B96B6359DA4F53 |
華文彩云 | STCaiyun | 534E65875F694E91 |
華文琥珀 | STHupo | 534E6587742573C0 |
華文隸書(shū) | STLiti | 534E658796B64E66 |
華文行楷 | STXingkai | 534E6587884C6977 |
華文新魏 | STXinwei | 534E658765B09B4F |
很全面吧,但也不要高興地太早,因?yàn)槲覀冇兄耸忠粋€(gè)規(guī)則的瀏覽器大軍,就算是舉著完美支持 CSS 大旗的 Firefox,也有不盡如人意的地方,因?yàn)?Firefox 居然不支持以上別名,對(duì)它來(lái)說(shuō) "Microsoft Yahei" 并不是微軟雅黑,只能反饋出瀏覽器默認(rèn)字體的的結(jié)果,唉,瀏覽器太多也不好,還不如回到 IE 壟斷的年代,沒(méi)有比較,也就沒(méi)有抱怨。
本文地址:http://m.likemindfilms.com/tutorial/wd1551.html
您可能還喜歡
- jquery Jcrop圖像裁切插件中文api文檔
- @media適配不同尺寸的手機(jī)
- 返回上一頁(yè)代碼的幾種寫(xiě)法
- Dreamweaver CC 2014新功能介紹
- 深入了解viewport和px
- 優(yōu)秀CSS代碼書(shū)寫(xiě)的10個(gè)規(guī)范
- 畫(huà)出你的風(fēng)格:HTML5創(chuàng)意畫(huà)板的設(shè)計(jì)教程
- Div中height:100%無(wú)效的解決辦法
- 網(wǎng)頁(yè)前端-網(wǎng)頁(yè)切圖命名規(guī)范
- 為網(wǎng)頁(yè)設(shè)計(jì)師而生的14個(gè)文本編輯器
- 專訪:石墨文檔產(chǎn)品總監(jiān)羅穎
- UI設(shè)計(jì)不得不知的移動(dòng)端UI尺寸適
- 光音移動(dòng)設(shè)計(jì)規(guī)范 — 表單類
- 體驗(yàn)設(shè)計(jì)中的排序問(wèn)題
- 網(wǎng)頁(yè)設(shè)計(jì)精粹 網(wǎng)頁(yè)中那些迷人的按
- aliued:響應(yīng)式設(shè)計(jì)的現(xiàn)狀與趨勢(shì)
- 10個(gè)智能對(duì)象處理的ps技巧
- 網(wǎng)頁(yè)UI - 原子設(shè)計(jì)理論(上)
- 如何通過(guò)設(shè)計(jì)提升banner點(diǎn)擊率?
- 晉小彥視覺(jué)設(shè)計(jì)系列文章(二):全屏