html - Typeface.js:我如何知道我要添加的字体的名称？

Question

我已经使用 Typeface.js 转换了一些字体，默认字体 Century Gothic 工作正常。但是现在我正在尝试使用我上传的 Century Gothic Bold，但我不知道确切的名称是什么。我试过“Century Gothic Bold”，但没有用。你怎么知道名字是什么？转换器不会告诉您或要求您在创建期间指定它。是文件名吗？

我不会上传任何代码，因为这只是一个一般性问题。

附言我应该澄清一下，我知道我可以添加 font-weight:bold 但这将是普通的“Century Gothic”加粗，而不是“Century Gothic Bold”字体，后者是完全不同的东西。我已经试过了，它看起来很糟糕。

Answer 1

@Adamantus 虽然不是具体的技术回答，但是不得不说:

我之前也使用过 Typeface.js。然而，一旦网络字体受到关注并且网络字体服务出现，我就不再使用它了。我松了一口气。

老实说，我认为按照今天的标准，在任何意义上都完全没有必要使用 Typeface.js:

1. 试图让它发挥作用的开销太大。这就是你毕竟要在这里发帖的原因。
2. 用 JavaScript 做一些可以很容易用 CSS 完成的事情是不正确的开发方法。
3. 如果您使用 Typeface.js 是因为您使用的是经过许可的字体(不是字体)，而 Century Gothic 不是免费字体。这意味着您仍然在非法使用字体，只是技术不同。

我诚实的建议是寻找一种类似于 Century Gothic 的网络字体，然后使用 @font-face 实现它。

这里有一个专门用于此目的的论坛:https://stackoverflow.com/questions/19675667/alternative-google-web-font-for-century-gothic

在这里你可以找到一个@font-face Sass mixin，它可以使实现网络字体更加容易:https://gist.github.com/ricardozea/9029840

这是mixin:

//@include fontFace(fontName, 'path/to/font'); » No need to specify the file extension in the "fontName" value

@mixin fontFace($font-family, $file-path, $weight:normal, $style:normal) {
    @font-face {
        font-family:$font-family;
        src:url('#{$file-path}.eot');
        src:url('#{$file-path}.eot?#iefix') format('embedded-opentype'),
            url('#{$file-path}.woff') format('woff'),
            url('#{$file-path}.ttf') format('truetype');
        font-weight:$weight;
        font-style:$style;
    }
}

用法:

@include fontFace(muli, '../fonts/muli');

祝你好运。