CSS font-family HelveticaNeue-Light 不呈现粗体答案

【问题标题】：CSS font-family HelveticaNeue-Light not rendering boldCSS font-family HelveticaNeue-Light 不呈现粗体
【发布时间】：2015-03-28 12:18:48
【问题描述】：

让 iOS 7/8 正确呈现我的字体让我头疼。看来 iOS 不知道如何渲染 Helvetica Neue Light (HelveticaNeue-Light/HelveticaNeue-Bold) 的粗体变体。

例如我有以下 CSS 选择器：

body {
    font-family: "HelveticaNeue-Light";
}

h1 {
    font-weight: bold;
}

h2 {
    font-weight: 600;
}

还有我的标记：

<li>
    <h1>A. Crimson Tide UK (Enabled Customer - UK Depot)</h1>
    <h2>1-14</h2>
    <h2>10:00 - 11:00</h2>
    <p>0914 Desc</p>
</li>

每当我有一个 h1 标签时，iOS 似乎都会呈现 Helvetica Neue Condensed Bold (HelveticaNeue-CondensedBold) - 而不是 Helvetica Neue Bold (HelveticaNeue-Bold)。

这是我的网页截图：

为什么它渲染的是 Helvetica Neue Condensed Bold 而不是 Helvetica Bold - 我没有在我的 CSS 中的任何地方设置 Condensed！

如果我将 h1 font-weight 设置为 900，它会在 Helvetica Neue 中渲染，并且略显粗体，但不是我想要的权重。

如果有人能对此有所了解，将不胜感激。

先谢谢你了。

【问题讨论】：

HelveticaNeue-Light 没有粗体版本...尝试使用 h1 font-family: "HelveticaNeue-Bold"; 而不是 bold iosfonts.com
谢谢！您能否将其更改为答案并解释为什么我不能这样做：font-family: "HelveticaNeue" 并解释为什么我不能使用各种字体粗细来使文本更轻/更粗（因为如果我设置 font-weight 似乎可以工作更大胆，但不是更轻）。因为这是我需要的答案，但我还不能给它一个答案:)
如果你有答案，请将它作为答案发布....我不太擅长 CSS :))

标签： ios css ios7 ios8 font-family

【解决方案1】：

我通过定义 HelveticaNeue 字体，然后指定权重并将它们指向相应的本地字体文件来克服这个问题，如下所示：

@font-face {
    font-family: "HelveticaNeue";
    font-weight: 100;
    src: local("Helvetica Neue Thin"),
    local("HelveticaNeue-Thin");
}

@font-face {
    font-family: "HelveticaNeue";
    font-weight: 300;
    src: local("Helvetica Neue Light"),
    local("HelveticaNeue-Light");
}

@font-face {
    font-family: "HelveticaNeue";
    font-weight: normal;
    src: local("Helvetica Neue"),
    local("HelveticaNeue");
}

@font-face {
    font-family: "HelveticaNeue";
    font-weight: bold;
    src: local("Helvetica Neue Bold"),
    local("HelveticaNeue-Bold");
}

然后将其指定为正文的首选字体系列和粗细：

body {
    font-family: HelveticaNeue, Helvetica, Arial, Verdana, sans-serif;
    font-weight: 300;
}

这样，所有的权重都在我的控制之下——粗体永远不会变成浓缩的粗体，它仍然是粗体。

回到为什么 iOS8 会这样做……不知道。

【讨论】：