使用数据 URI 的 Base64 编码 OpenType 字体

本文介绍了使用数据 URI 的 Base64 编码 OpenType 字体的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着跟版网的小编来一起学习吧！

我想在 font-face 中添加一个 base64 编码 OpenType 字体作为数据 URI.

I want to add a base64 encoded OpenType font as a data URI in font-face.

到目前为止我有这个:

@font-face {
    font-family: 'test';
    src: url(data:font/otf;base64,
        // Base64 string here ...
    ) format('opentype');
}

但我认为它没有将字体正确地包含在我的风格中.

But I believe it does not include the font correctly to my style.

对此的任何帮助将不胜感激.

Any help with this would be really appreciated.

数据 URI 总是采用这种格式:

Data URIs are always of this format:

data:[<mediatype>][;base64],<data>

每个数据 URI 的第一部分是 media-type，在 Open Type 字体的情况下是:

The very first part of every data URI is the media-type, which in the case of an Open Type font is:

font/opentype

所以，你可以这样使用它:

So, you may use it like this:

@font-face{
    font-family: test;
    src: url(data:font/opentype; base64, [base64 string here]);
}

更换

[base64 string here]

使用您的 base-64 编码字符串的精确复制粘贴版本.

with the exact copy-pasted version of your base-64 encoded string.

备注

请注意:

在线编码工具

您可以使用 this 工具，将您的字体文件转换为编码字符串.

You may use this tool, to convert your font file to the encoded string.

这篇关于使用数据 URI 的 Base64 编码 OpenType 字体的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持跟版网！

本站部分内容来源互联网,如果有图片或者内容侵犯了您的权益，请联系我们，我们会在确认后第一时间进行删除！

相关文档推荐