Question

我在Firefox中使用自定义字体时遇到问题，在所有其他浏览器中它都能正常工作。

问题是：

在同一页面上，我有 h2 和 h3 - 它们使用相同的字体和相同的方式设置样式（其他属性有点不同），但对于某些原因FF正确加载 h3 但不适用于 h2 。

h2 和 h3 具有相同的自定义字体（ A ），它们都有：首字母使用自定义字体设置样式（ B ）。

所以，基本上， h3 加载两种字体，但 h2 仅加载1种字体并忽略：first-letter 。关于如何解决这个问题的任何想法？

谢谢！

h2 {
    display: block; 
    width: 300px;
    height: 103px;
    font-family: 'Gotham Book';
    font-size: 1.6em;
    background: url('images/title-bg.jpg') no-repeat;
    text-align: center;
    letter-spacing: 0.1em;
    margin: 0 auto;
}

h2:first-letter {
    font: 2.2em 'Edwardian Script ITC';
    padding: 0 6px 0 0;
} 

h3 {
    display: block;
    margin: 100px 40px 40px 40px;
    font-family: 'Gotham Book';
    font-size: 1.1em;
    text-align: center;
    letter-spacing: 0.1em;
    border-bottom: dashed #2babcb;
    border-top: dashed #2babcb;
    border-width: 1px;
}

h3:first-letter {
    font: 2.2em 'Edwardian Script ITC';
    padding: 0 6px 0 0;
}

Answer 1

尝试检查Firebug或Chrome Developer，看看发生了什么。可能你的风格被覆盖了，它至少会给你一个开始的地方。否则，请检查您正在构造的元素，也许您的框架中有一些JavaScript会更改显示为内联样式的样式。祝你好运，如果你发现了问题，请告诉我们！

Firefox中的自定义字体

1 个答案: