我尝试了各种代码来嵌入自定义字体,最后似乎在 FF 和 IE8 上面的工作。但它在 IE7 中不支持。
@font-face {
font-family: 'xyzfont';
src: url('fonts/abc-font.eot?') format('eot'),
url('fonts/abc-font.woff') format('woff'),
url('fonts/abc-font.ttf') format('truetype');
}
h1, h2, h3, div span { font-family: 'xyzfont', Georgia, Arial; }
欢迎提出任何使其更兼容(例如 IE7)的建议。
最佳答案
这是我用来在每个浏览器中嵌入我的字体的 css,希望对您有所帮助:
@font-face {
font-family: 'xyzfont';
src: url('fonts/abc-font.eot'); /* IE9 Compat Modes */
src: url('fonts/abc-font.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('fonts/abc-font.woff') format('woff'), /* Modern Browsers */
url('fonts/abc-font.ttf') format('truetype'), /* Safari, Android, iOS */
url('fonts/abc-font.svg#svgFontName') format('svg') /* Legacy iOS */
}
另请注意,您可以设置不带引号的字体系列,如下所示:
h1, h2, h3, div span { font-family: xyzfont, Georgia, Arial; }
您可以了解字体浏览器支持 here .
fontsquirrel可能是生成您需要的每种字体格式的最佳场所。
这article说明如何找到要添加到 SVG 字体标签后的字体 ID。
如果有人问为什么 ?#iefix
用于 IE6-IE8 浏览器 eot 字体,请参阅 answer .
关于html - 使用 CSS 包含自定义字体以使其与大多数浏览器兼容的最佳方法是什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18871680/