将CSS中的Glyphicons嵌入数据-uri

Question

我有一个使用Glyphicons的Web应用程序，但客户端无法下载字体。

我找到了一个页面，说你可以转换为uri Glyphicon文件并将它们嵌入Bootstrap CSS中，我做了。

（部分上市）

@font-face {
  font-family: 'Glyphicons Halflings';
  src: "data:application/octet-stream;base64,n04AAEFNAAAC.......

当我在服务器上测试它时，我只得到一个字形应该是的框。我错过了一步吗？

应用程序确实使用SASS--这可能是问题吗？

Answer 1

您的商品信息片段中存在以下错误：

• src dataURI值必须位于url()'函数'，
中
• 它必须具有正确的mime类型而不是application/octet-stream：例如application/font-woff，
• 或相应的format()声明：例如format('woff')。或两者都更好。

正确的模板应该看起来像

@font-face {
    font-family: '[name]';
    src: url(data:font/[mime-format];base64,...) format('[css-format]');
    /* font-weight, font-style, ... */
}

SASS不应该是结果代码段的问题，因为长文件是.scss而不是.sass。