Question

我有@ font-face规则，它看起来像这样：

@font-face{
    font-family:'F';
src:url("") format("embedded-opentype"),
url(data:application/x-font-woff;charset=utf-8;base64,d09GRgABAA ... ETC... ETC

我可以将其转换为字体文件吗？

谢谢！

Answer 1

复制base64编码的部分并进行转换。有很多方法可以做到这一点。

<强>的Linux

base64 -d base64_encoded_font.txt > font.woff

Mac OS X

openssl base64 -d -in base64_encoded_font.txt -out font.woff

<强>窗

转到http://www.motobit.com/util/base64-decoder-encoder.asp并粘贴文字。选择“解码Base64字符串中的数据（base64解码）”和“导出到二进制文件”。

Answer 2

@ mcrumley的答案是正确的，但对于那些无法弄清楚和/或害怕命令行的人，我有另一种方法。

我刚用Google搜索了你的问题，发现http://base64converter.com/可以将任何base64文件转换/解码（并编码）回原始格式。在过去，我用它来编码和解码base64图像，但这是我第一次使用字体。作为测试，我插入了随机网页的css文件中的嵌入式base64字体信息。您不想要整个条目，请不要使用css信息，否则转换将失败。

（例如）删除base64之前的此信息：

@font-face{font-family:"Example";src:url(data:application/x-font-woff;base64,

从最后删除：
```
;font-weight:400;font-style:normal}
```
您将留下base64编码数据，将其粘贴到＆＃34;输入＆＃34;字段，选择＆＃34;解码＆＃34;输出并按下按钮。它将创建一个名为download.bin的文件：单击它以下载它。然后将文件扩展名从bin更改为woff（您的字体文件类型可能会有所不同，但会在css中说明）。我能够打开.woff文件，转换工作完美;不仅保存了所有轮廓，而且字形名称，opentype特征，字距调整以及所有内容也是如此。

当然，与任何用于翻录网页字体的方法一样，输出的字形数量可能仅限于相关网页上使用的字形数量。

如果woff文件不是您所需要的，那么有很多在线工具可以将woff转换为您选择的格式。或者，如果您需要离线工具，请查看我提出的问题以及我收到的答案：

Modify Python Script to Batch Convert all "WOFF" Files in Directory

Answer 3

复制：

data:application/x-font-woff;charset=utf-8;base64,d09GRgABAA ...ETC

将其粘贴到浏览器的地址栏中，然后按Enter。
```
- A save as window appear -
```
选择要保存到的文件夹（例如：mywebsite / fonts），文件名：myfont.woff
```
- you now have myfont.woff in a folder -
```

包含在CSS中：

@font-face {
   font-family: 'myfont';
   src: url('fonts/myfont.woff');
   font-weight: normal;
   font-style: normal;
}

添加到课程：

.headline {
font-family: 'myfont', Helvetica, Arial, sans-serif;
}

完成。 ?

（请注意，您必须使用与data：URI语法中声明的文件格式相同的格式。在您的情况下... application/x-font-woff ...因此为myfont.woff）

我可以将嵌入式base64编码字体转换为字体文件吗？

3 个答案: