如何在 CSS 中使用 Helvetica Neue Condensed Bold？

Question

我想在我的网页上使用 Helvetica Neue Condensed Bold，但它似乎不起作用。我已经尝试过这个： http://jsfiddle.net/ndFTL/ 但它不起作用，它只是显示为 Helvetica Neue Bold。

我安装了 Helvetica Neue Condensed Bold：

有人可以帮我吗？

Answer 1

经过大量摆弄后，让它工作（仅在 Webkit 中测试）：

font-family: "HelveticaNeue-CondensedBold";

font-stretch 在 CSS2 和 2.1 之间被删除，虽然又回到了 CSS3，但仅在 IE9 中受支持（从来没有想过我能这么说）关于任何 CSS 属性！）

这是有效的，因为我使用的是 postscript 名称（在字体书中找到字体，点击 cmd+I），这是非标准行为。它可能值得使用：

font-family: "HelveticaNeue-CondensedBold", "Helvetica Neue";

作为后备方案，否则其他浏览器如果无法解决问题，可能会默认使用衬线。

演示：http://jsfiddle.net/ndFTL/12/

Answer 2

我遇到了同样的问题，并且无法使其在所有浏览器上运行。

所以这是我能找到的 Helvetica Neue Condensed Bold 的最佳字体堆栈：

font-family: "HelveticaNeue-CondensedBold", "HelveticaNeueBoldCondensed", "HelveticaNeue-Bold-Condensed", "Helvetica Neue Bold Condensed", "HelveticaNeueBold", "HelveticaNeue-Bold", "Helvetica Neue Bold", "HelveticaNeue", "Helvetica Neue", 'TeXGyreHerosCnBold', "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif; font-weight:600; font-stretch:condensed;

甚至可以在以下位置找到更多堆栈：

http://rachaelmoore.name/posts/design/css/web-safe-helvetica-font-stack/

Answer 3

如果有人仍在寻找 Helvetica Neue Condensed Bold，您基本上有两个选择。

1. fonts.com：从 fonts.com 将真实字体授权为网络字体。免费（带有徽章），25 万页面浏览量为 10 美元/月，250 万页面浏览量为 100 美元/月。您可以使用最昂贵的套餐将字体下载到桌面（但如果您使用的是 Mac，则已经拥有它）。
2. myfonts.com / fontspring.com：购买非常接近的替代品，例如 MyFont 的 Nimbus Sans Novus D（无限浏览量 160 美元），或 Franklin Gothic FS Demi Condensed，来自 fontspring.com（约 21.95 美元，一次性统一费用，浏览量不受限制）。在这两种情况下，您还可以下载桌面字体，以便可以在 Photoshop 中使用它进行合成。

一个非常便宜的折衷方案是从 fontspring 购买 Franklin，然后使用“HelveticaNeue-CondensedBold”作为 CSS 中的首选字体。

h2 {"HelveticaNeue-CondensedBold", "FranklinGothicFSDemiCondensed", Arial, sans-serif;}

然后，如果 Mac 用户加载您的网站，他们会看到 Helvetica Neue，但如果他们在其他平台上，他们会看到 Franklin。

更新：我发现与 Helvetica Neue Condensed Bold 更接近的匹配是 Nimbus Sans Novus D Condensed 粗体。事实上，它也是源自Helvetica。您可以在 MyFonts.com 上以 20 美元（桌面版）和 20 美元（网页版，10k 页面浏览量）的价格购买它。网页浏览量不受限制，价格为 160 美元。我自始至终都使用这种字体（即根本不利用 Mac 内置的“NimbusSansNovusDBoldCondensed”），因为它导致跨浏览器的设计更加统一。内置 HN 和 Nimbus Sans 在所有方面都非常相似，但点大小不同。 Nimbus 需要一些额外的积分才能获得相同尺寸的匹配。

Answer 4

“Helvetica Neue Condensed Bold”可以在 Firefox 上使用：

.class {
  font-family: "Helvetica Neue";
  font-weight: bold;
  font-stretch: condensed;
}

但在 Opera 上却失败了。

Answer 5

您必须将字体转换为网络字体，如以下问题所示：

• 非标准字体在网络中？
• 如何添加一些非标准字体到网站？

但是，您可能会遇到版权问题：并非每种字体都允许作为网络字体分发。检查您的字体许可证以查看是否允许。

使用网络字体的最简单、免费且合法的方式之一是 Google 网络字体。然而，遗憾的是，他们的产品组合中没有 Helvetica Neue。

最简单的非免费且合法的方法之一是从提供网络许可证的铸造厂购买字体。我碰巧知道 myFonts 铸造厂是这样做的；他们甚至为您提供了一个完整的包，其中包含预先准备好的所有 JavaScript 和 CSS。我确信其他铸造厂也会这样做。

编辑： MyFonts 有 Helvetica neue 库存，但显然没有网络许可证。查看类似字体列表，其中一些具有网络许可证。另外，Ray Larabie 那里有一些不错的字体，有网络许可证，其中一些是免费的。