Windows瀏覽器中的像素化字體-facepad

我一直在尋找這個問題，但沒有清楚的理解這個問題。 我在某些Windows 7瀏覽器上看到了非常醜陋的像素化字體效果圖。我在CSS中使用@font-face。Windows瀏覽器中的像素化字體-facepad

這是一個@font-face的問題？我應該使用<link>來鏈接字體嗎？

我該如何解決這個問題？

2013-11-09 gespinha

哪個版本的Windows和哪些瀏覽器完全相同？除非用戶啓用「清除類型」，否則Windows XP本身會出現字體平滑問題，無法在您身邊解決問題。 Windows 7+上的Chrome具有反鋸齒問題。 –

@TigranPetrossian Windows 7，更精確。 – gespinha

我假設你有你的CSS格式完美。

我也對此感到沮喪。我會盡力分享我的經驗：大多數瀏覽器都使用隨瀏覽器一起安裝的字體渲染引擎。 Firefox和IE做到這一點，並且他們顯示的字體非常好。然而，Chrome會以不同的方式做事。它使用本地操作系統字體渲染引擎，並造成盲點。在Windows上（以我的經驗W7 & W8），即使在更改操作系統字體渲染設置之後，對於替代字體（例如谷歌網絡字體），渲染對我來說一直都很難看。一些奇特的CSS規則似乎有所幫助（-webkit-font-smoothing），但它從來沒有完全解決像素化問題。

對於開發目的，我建議忽略Chrome上的像素化字體並在Firefox或IE或Mac設備上查找。

關於字體渲染有很多需要說的，我建議閱讀它們。這個鏈接應該讓你開始：http://www.smashingmagazine.com/2012/04/24/a-closer-look-at-font-rendering/

編輯：因爲我現在是Mac用戶，我無法檢查它，但我認爲這是一個webkit的問題，所以當我說鉻，我也意味着Safari。

來源

2013-11-09 12:59:45 belens

是的，似乎是這樣。這麼多的@ font-face功能：P ...感謝無論如何，我會繼續閱讀這個主題;） – gespinha

如果它是一個窗口的東西，那麼它可能使用的CPU，而不是GPU的與Windows兼容的瀏覽器的問題，以使各種圖形 - 包括矢量/字體

地址：

body { 
    -webkit-transform: translateZ(0); 
    -moz-transform: translateZ(0); 
    transform: translateZ(0); 
}

到您的CSS，爲了強制使用電腦GPU - 你應該看到你的字體更好。

來源

2013-11-09 13:02:23 silicakes

Nop，這是行不通的。字體與CSS屬性的其餘部分分開呈現。 – gespinha

Windows瀏覽器中的像素化字體-facepad

回答

相關問題