CSS字体在Chrome中显示良好，但不在FF或IE中显示

Question

我创建了一个着陆页，需要标题为Avenir字体。我在Chrome中正确渲染它，但它不适用于任何其他浏览器。有什么东西我不见了吗？

CSS

    h1,h2,h3,h4,h5, .section h2 {
        margin:0;
        padding:0;
        color:#c41230;
        font-family: AvenirLT-Black;
        font-weight:normal;
    }

HTML

<div class="ten columns title">
          <h1 style="font:AvenirLT-Black">Additional Information</h1>
        </div>

Answer 1

将font-family值传递给OS字体子系统。

Windows有两种不同的字体子系统：DirectWrite和GDI。 Chrome使用较旧的GDI; Firefox和IE使用DirectWrite。

GDI没有办法为每个家庭代表两种以上不同的字体权重，因此超粗体或超轻型字体会映射到不同的姓氏，通常以“黑色”或“浅色”为后缀或“ExtraLight”。另一方面，DirectWrite可以表示每个家庭的多个权重。因此，DirectWrite很可能将您的字体视为字体，其姓氏为“AvenirLT”，并且字体粗细。所以你想做这样的事情：

font-family: AvenirLT, AvenirLT-Black;
font-weight: 900;