font-awesome 中的字体文件有什么用？答案

【问题标题】：What is the use for font files from font-awesome?font-awesome 中的字体文件有什么用？
【发布时间】：2016-01-10 19:41:56
【问题描述】：

我正在使用font-awesome，它适用于 CSS 文件的 CDN 扩展。下面是一个简单的例子：

<html>
    <head>
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.css">
    </head>
    <body>
        <i class="fa fa-adjust"></i>
    </body>
</html>

该示例运行良好，但从the CDN，我还获得了.otf、.eot、.svg、.ttf、.woff 文件的链接。如果示例仅使用 .css 文件扩展名即可很好地呈现，这些文件有什么用？

【问题讨论】：

如果浏览器/操作系统不支持该字体，则将使用该字体
你是网页字体，那些包含在主css文件“检查部分字体路径”cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/…
@SilentTremor - 这意味着一旦我们包含 css，我们就不需要再添加这些其他文件了？如果是这样，为什么单独提供链接？有什么具体原因吗？
如果您只想使用字体，则提供链接供您单独使用该 css 文件。但是由于您使用的是很棒的字体，因此仅引用 css 就足够了。

标签： javascript html css fonts font-awesome

【解决方案1】：

虽然某些浏览器支持 TTF/OTF 格式作为 Web 字体，但 Internet Explorer 会生成错误，除非该字体设置为可安装嵌入模式。当 .woff 和 .eot 变体均未提供给 IE 时，会重现此行为。

可以通过使用以下实用程序之一将字体文件中的 fsType 标志设置为 0000（表示可安装嵌入模式）来解决此问题：使用 tembed-js npm 模块

npm install -g ttembed-js
ttembed-js path/to/fontawesome-webfont.ttf
ttembed-js path/to/FontAwesome.otf

或者，在 node.js 中：

var callback = function(error, oldFsType) {
    if (error) {
        console.error('Something went wrong.', error);
        return;
    }
    if (oldFsType === '0000') {
        console.log('fsType is already 0000; no action taken.');
    } else {
        console.log('fsType successfully changed from ' + oldFsType + ' to 0000.');
    }
}
var ttembed = require('ttembed-js');
ttembed({filename: './path/to/fontawesome-webfont.ttf'}, callback);
ttembed({filename: './path/to/FontAwesome.otf'}, callback);

使用原来的tembed

git clone https://github.com/hisdeedsaredust/ttembed.git
cd ttembed
make
./ttembed path/to/fontawesome-webfont.ttf path/to/FontAwesome.otf

【讨论】：

【解决方案2】：

这是因为如果您看到该 css 文件，您会发现正在导入或调用所有这些文件的链接或代码。基本上 css 只是显示和调用特定图标的代码。但该图标在那些 otf 和其他文件中。就像您只能在 html 中调用 img 标签，但为什么您需要将网站中的图像保存在网站中。希望它清除

谢谢

【讨论】：

好的，但是作为用户，现在我只需要调用.css文件的cdn即可。我永远不需要从 cdn 扩展其他文件（.otf、.ttf、.eot 等）？
@Peterson 不，这取决于浏览器。
@BF - 但是当所有其他文件已经包含在 .css 文件中时（请参阅上面的链接），那么为什么我们仍然会在我们的代码中再次拥有它们的外部链接（除了 .css 文件内部）。 css 文件已经包含这些其他类型的字体文件）？ cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/…