字體真是個麻煩的東西，然后又是個重要的東西。為以更方的解決字體問題，就像上次推薦的《再談 Web 默認字體》，為了Pixel Perfect，我們不斷糾結。像支付寶在CSS Reset中是這樣寫的：

body{font:12px Tahoma,Helvetica,Arial,'宋體',sans-serif}

而淘寶這樣寫：

body,button,input,select,textarea{font:12px/1.5tahoma,arial,'宋體',sans-serif;}

個人偏向于淘寶的寫法，顯然，button/input/select/textarea的字體都是要重設才會顯示正常的。這里并不是為了討論這個，而是這里面都有 tohama 這種字體，它是今天的主角。因為字體顯示好，也因為導致 BUG 而被搬上臺面。讓我們來先看一個Demo:

Here: IE8 Tahoma Font-family bug

如果你是從 IE8 打開，將會看到第一個按鈕有錯位。如標題所說，你懂的，這就是 Tahoma 給我們帶來的問題。而解決方案很簡單，就是避用 tahoma 字體，其他的隨便。比如：

body,button,input,select,textarea{font:12px/1.5arial,'宋體',sans-serif;}

在支持沒有那么完美的狀況下，這樣的解決方式可以說是完美的。即使你像我一樣也有一套 Hack 兼容方案，還是不推薦使用暴力方式，我們的目標是、也應該是更有效、更優雅。

然后，其實 hack IE 8的時候，可以考慮 selector{property:value\0;} 這樣的方法來，因為這是 IE8+ 獨有的方法。Hmmm… 多好，雖然有點暴力。最后，推薦一下鴿子工友。解決這個 Bug，還得歸功于他。

——————————–

經過一條完美分割線從火星來到地球，囧，剛剛還測試了arial放在前面是可以的，而且早上測試過，不過，事實證明測試要更小心，要多次，不然可能刷出來的是緩存。事實的解決方法似乎是這樣的：

• 有中文和英文混排的時候，怎么寫都無所謂；
• 只有中文的時候，放在前面最好的系統所擁有的字體，或者一種系統沒有的字體來讓他顯示默認字體；
• 全英文就更是所所謂了

  多謝幫助尋找真相的 Justice 和 默默同學，一個問到底，一個提供一個非中文的 IE8 顯示效果圖片。

  
            Tag: 設計公司 | 網頁設計公司 | 廣告公司 | 網站設計 | 平面設計 | 互動媒體 | 網頁設計 | Web design | Website design | design house | 媒體公司 | Iphone app | 程式設計 | Flash 網頁 | Flash game | 動畫設計 | 後期製作 | 網上商店 | 網上宣傳 | 網頁服務 |