使用Google Web字體優先處理SVG字體

Question

除非您使用SVG字體，否則在Google Chrome瀏覽器中進行字體表面渲染非常糟糕。但谷歌網頁字體優先WO WO文件。

有什麼辦法強制它提供SVG字體，還是我必須自己手動託管字體？

Answer 1

您需要將文件託管爲使用@import或<link>方法引用僅調用WOFF文件（由於瀏覽器檢測）的CSS文件。防爆。 http://fonts.googleapis.com/css?family=Open+Sans：

@font-face { 
    font-family: 'Open Sans'; 
    font-style: normal; 
    font-weight: 400; 
    src: local('Open Sans'), local('OpenSans'), url('http://themes.googleusercontent.com/static/fonts/opensans/v6/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff') format('woff'); 
} 

一旦託管文件在本地，然後你可以移動SVG調出棧確定其優先級。你可以在這裏看到一個例子：http://www.fontspring.com/blog/smoother-web-font-rendering-chrome

@font-face { 
    font-family: 'MyWebFont'; 
    src: url('webfont.eot'); 
    src: url('webfont.eot?#iefix') format('embedded-opentype'), 
    url('webfont.svg#svgFontName') format('svg'), 
    url('webfont.woff') format('woff'), 
    url('webfont.ttf') format('truetype'); 
}