作者hanasan (永遠猜不透)
看板Web_Design
標題Re: [問題] 指定CSS時 字體的英文名稱
時間Fri Jun 29 18:57:51 2012
※ 引述《willy69wu31 (小小吳)》之銘言：
: 由於希望網頁在顯示時，可以英文一套字體，中文則又是另一套字體
: 問google無意間得到這篇 http://blog.roodo.com/wolf_totem/archives/4747565.html
: 如果文章正確的話，就表示其他語言版的系統，若要正確以指定的字體顯示文字
: 就應該在CSS用英文名稱指定字型?
: 不過，字體這麼多種，如果都靠查表來看英文名稱，萬一遇到表上沒有的字體
: 想請問要怎麼判斷一個中文字體的英文名稱?
我推測你應該知道如何用CSS指定字形, font-family
而 font-family 設定網頁字形的設計，原本就提供多組字形指定，在不同OS或語系
的情況下，網頁找不到第1組就自動換找第2組，如果你指定的統統找不到，都沒有
它會自動使用OS(browser)預設的字形...
你主要想知道的是中英文混合的情況，在設定時要小心，「先英後中」是秘訣。
純英文環境 我們大概會這樣設
font-family: Arial, Helvetica, verdana, san-serif;
// 至少2組以上，最後決定如果統統找不到，就用 無襯線字體
中英文混合，我們就這樣設
font-family: Arial, Helvetica, verdana, "微軟正黑體", "新細明體", san-serif;
// 先設好3組備選英文字形後再加2組中文備選，最後指定無襯線字體
你可能會有二個疑問
1. 為什麼要 先英後中？
這是因為繁體中文字形，有一些它本身也含了英文字符或符號的長相，
有趣的是，在一篇中英文混合的內文裡，browser會「先決定英文用什麼，再決定中文」
重點來了，因此如果你設的是
font-family: "新細明體", Helvetica, Arial, san-serif;
因為新細明體也有它自己的英文長相，browser在第一步決定英文用甚麼字形時
第1個就找到了...之後的H跟A字形它就不管了，所以中英文都是新細明體
反過來如果你設定的順序像這樣
font-family: Helvetica, Arial, "新細明體", san-serif;
那篇文章就會用 Helvetica 或 Arial 的英文字體 配上"新細明體" 的中文字
2. 我怎麼查中文字型的英文名稱?
你可以照推文大大給的方法查，但我給你的答案是「不需要」
原因很簡單，因為中文字也是有分 襯線 跟 無襯線 字體
即使你在純英文OS瀏覽台灣雅虎網站好了...
它在找完英文字形後，還是會決定中文要用什麼字形，都找不到就自動用
san-serif 或 serif 來顯示中文字了
我長期都在設計英文網頁，英文字形可用的變化很多，但中文就那幾個，
Win Vista 以上多了微軟正黑體可以用，可以擺脫看膩的新細明體。
基本上網頁上的文章可讀性要高還是推薦用
無襯線字型(san-serif)，serif文字一般都用來顯示標題或是實體紙張列印時使用
另外，字體集除了 襯線 跟 無襯線 外，還有一些比較不常用的如
cursive、fantasy、monospace 等
monospace 是等寬字體，經常用來設定顯示程式碼會比較容易閱讀
Windows內建的 monospace類字型 有 "Courier" & "Courier new" 等~
落落長一篇希望有解答到你的疑問 :D
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 111.250.218.207
→ willy69wu31:謝謝! 我主要是要問第二點:P 06/29 20:11
→ Rplus:ps: Opera 的字型判斷跟主流不太一樣唷~ 非常傷腦筋~ 06/29 20:31
→ kerash:預設字型是瀏覽器可以設定的，所以沒有就是看瀏覽器預設 06/29 21:47
→ kerash:不能確保一定是甚麼字型 06/29 21:47
推 sycc:我查到的資料都是說serif的可讀性強(有粗細、末端加變化)所以 06/29 23:31
→ sycc:建議使用在正文耶~ 跟h大的說法不同? 06/29 23:31