自定義字體在Chrome上不正確顯示

Question

我想爲我的網站使用自定義字體，但在Chrome（最新版本）和Opera瀏覽器中顯示錯誤，雖然它在其他瀏覽器上顯示正確（平滑）。我嘗試了幾種不同的字體，在Chrome/Opera上也有相同的結果。

我的代碼：

@font-face { 
    font-family: 'mainFont2'; 
    src: url('../fonts/Eurostile.eot'); 
    src: local('☺'), url('../fonts/Eurostile.woff') format('woff'), url('../fonts/Eurostile.ttf') format('truetype'), url('../fonts/Eurostile.svg') format('svg'); 
    font-weight: normal; 
    font-style: normal; 
} 

問題：

Answer 1

那OS是多麼的瀏覽器，並呈現font..but嘗試調用.SVG格式在.woff格式之前，它可能會解決這個問題。

@font-face { 
    font-family: 'mainFont2'; 
    src: url('../fonts/Eurostile.eot'); 
    src: local('☺'), 
    url('../fonts/Eurostile.svg') format('svg'), 
    url('../fonts/Eurostile.woff') format('woff'), 
    url('../fonts/Eurostile.ttf') format('truetype'); 
    font-weight: normal; 
    font-style: normal; 
} 

Answer 2

我將把你這個問題： https://stackoverflow.com/a/4060778/1121870

或者試試字體平滑： http://www.w3.org/TR/WD-font/#font-smooth-prop

而且還有一個討厭的小黑客在這裏： http://www.elfboy.com/blog/text-shadow_anti-aliasing/