是否可以像css一样将字体文件嵌入html？

在我工作的项目中，我需要生成一个单页HTML文件，其中包含所有内容（JavaScript代码、CSS、图像等）。因此，不应该有外部参照

我也计划使用Bootstrap，但我不确定是否可以像CSS一样将字体文件嵌入HTML中

---

有什么想法吗？

是的，这实际上是可能的。您可以将字体嵌入为base64编码字体，如下所示：

@font-face{
    font-family: FontName;
    src: url(data:font/ttf;base64,THESTRING… ) format('truetype');
}

@font-face { font-family: 'yourfontname'; src: url(data:application/x-font-woff;charset=utf-8;base64,**your base64 here**) format('woff'), font-weight: normal; font-style: normal; }

---

但这是不可取的，因为base64字符串可能变得相当大，并导致性能问题。

是的，您可以。您必须将字体转换为BASE64字节并嵌入数据URI，如下所示：

@font-face{
    font-family: FontName;
    src: url(data:font/ttf;base64,THESTRING… ) format('truetype');
}

@font-face { font-family: 'yourfontname'; src: url(data:application/x-font-woff;charset=utf-8;base64,**your base64 here**) format('woff'), font-weight: normal; font-style: normal; }

您可以使用此网站将字体转换为Base64：

---

您是否允许在HTML文件中使用

？您是否尝试将字体作为数据：URI嵌入CSS中？@最重要的是，应该没有外部引用。@D4V1D-hmm，显然：）否则我将如何嵌入CSS？对，我本来打算建议您直接在

HTML

文件的

CSS

中链接字体文件，但后来，我想起了您的

不应该是外部参考

要求：）。我想嵌入为

base64

编码是唯一的解决方案是的，这就是我想要的！谢谢！如果这是一个网页，我不会这样做，但是一个工具会生成一个HTML报告，所有的东西都需要在其中。问题是我不知道这是否可行，但现在我知道：）