@font-face - 变音符号问题

发布于 2025-01-02 20:06:29 字数 1063 浏览 0 评论 0原文

我在使用我自己的字体 @font-face 时遇到 CSS3 属性问题。在 Chrome、Safari 和 IE10 浏览器中没有任何问题，但在其他浏览器中存在几个问题：

我使用了以下代码：（字体 Gabriola a monotype - 两者代码相同）

@font-face {
    font-family: "Gabriola";
    src: url("../fonts/Gabriola.eot?") format("eot"),
         url("../fonts/Gabriola.woff") format("woff"),
         url("../fonts/Gabriola.ttf") format("truetype"),
         url("../fonts/Gabriola.svg#Gabriola") format("svg");
    font-weight: normal;
    font-style: normal;
}

在 Google Chrome 中一切正常：屏幕

Firefox 将带有变音符号的字母替换为其他字体 - 屏幕

Opera 包含的字体之一不显示无论如何，第二个文本中的文本会跳过带有变音符号的字母： Screen< /a>

在新的 IE10 一切正常，旧版（IE9 和 IE8）的行为与 Firefox 类似。

我该如何修复这个问题？或者至少用一些通用字体（如 Arial，...）替换有问题的浏览器中的字体系列，并更改字体大小属性。对于 IE 有很好的破解方法，但是 Opera 和 Firefox 呢？

谢谢你！

原文

I have a problem with CSS3 property for using my own fonts @font-face. In Chrome, Safari and IE10 browsers aren't any problems, but in other browsers there are several problems:

I used this code: (fonts Gabriola a monotype - same code for both)

@font-face {
    font-family: "Gabriola";
    src: url("../fonts/Gabriola.eot?") format("eot"),
         url("../fonts/Gabriola.woff") format("woff"),
         url("../fonts/Gabriola.ttf") format("truetype"),
         url("../fonts/Gabriola.svg#Gabriola") format("svg");
    font-weight: normal;
    font-style: normal;
}

In Google Chrome everything is OK: Screen

Firefox replace letters with diacritic with an other font - Screen

Opera one of the included fonts doesn't display at all and the in the text with second one skip the letters with diacritic: Screen

In the new IE10 there's everything ok and the older ones (IE9 and IE8) are behaving like Firefox.

How can I repair this? Or at least replace the font-family in the problematic browsers with some universal font (like Arial, ...) and change the font-size property. For IE there are good hacks but how about Opera and Firefox?

Thank you!

分享到QQ

分享到微博