Dea*_*ool 0 html javascript css fonts font-awesome
我正在使用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>
该示例运行正常,但在CDN,我也得到了链接.otf,.eot,.svg,.ttf,.woff文件.如果示例只使用.css文件扩展名渲染,这些文件有什么用？
虽然某些浏览器支持TTF/OTF格式作为webfonts,但Internet Explorer会生成错误,除非该字体设置为Installable Embedding模式.当.woff和.eot变体都没有提供给IE时,会再现此行为.
这可以通过使用以下实用程序之一将字体文件中的fsType标志设置为0000(表示可安装嵌入模式)来解决:使用ttembed-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);
使用原始的ttembed
git clone https://github.com/hisdeedsaredust/ttembed.git
cd ttembed
make
./ttembed path/to/fontawesome-webfont.ttf path/to/FontAwesome.otf