html - @font-face 不适用于 Chrome 和 Safari

Question

我使用了@font-face 并以.ttf、.eot 和.woff 格式上传了所有字体。 它在 Firefox 上运行良好，但 Chrome 和 Safari 所有文本都转向 Times New Roman。 这是代码:

@font-face {
font-family: 'Open Sans Regular';
src: url(../open_sans/OpenSans-Regular.eot);
src: url("../open_sans/OpenSans-Regular.woff") format('woff');
src: local('Open Sans'), url('../open_sans/OpenSans-regular.ttf') format('truetype');
}

Answer 1

你有一个非常酷的网站，名为:http://www.fontsquirrel.com/tools/webfont-generator 另外，也修改了您的代码。

@font-face {
font-family: 'open_sansregular';
src: url('../open_sans/OpenSans-Regular.eot');
src: url('../open_sans/OpenSans-Regular.eot?#iefix') format('embedded-opentype'),
     url('../open_sans/OpenSans-Regular.woff') format('woff'),
     url('../open_sans/OpenSans-Regular.ttf') format('truetype'),
     url('../open_sans/OpenSans-Regular.svg#open_sansregular') format('svg');
font-weight: normal;
font-style: normal;

}

PS: open sans 显然是google font 如果是的话那么用google code 嵌入很容易，太靠谱了。网址:http://www.google.com/fonts#UsePlace:use/Collection:Open+Sans 如果仍然发现问题，请告诉我。