无法在 Phonegap 中使用自定义字体答案

【问题标题】：Not able to use custom fonts in Phonegap无法在 Phonegap 中使用自定义字体
【发布时间】：2015-05-16 18:40:07
【问题描述】：

在查看了各种解决方案后，like this one，我仍然无法让难以捉摸的图标在 Phonegap 中工作。

它在我的计算机上运行良好，但是一旦我使用 Adobe 应用程序生成器创建了应用程序，网络字体图标就不再显示。

我的文件夹结构如下：

我的 CSS 看起来像这样：

@font-face {
  font-family: 'Elusive-Icons';
  src: url('../res/fonts/elusive-icons.ttf') format('truetype'),
       url('../res/fonts/elusive-icons.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

如果有人对我可以做些什么来解决这个问题有任何建议，我将不胜感激。

【问题讨论】：

标签： android css cordova webfonts

【解决方案1】：

我建议将字体直接嵌入到 CSS 文件中。您可以使用 Gift of speed Base 64 encoder 或 Opinionated geek Base 64 encoder 之类的网站对您的字体进行 Base 64 编码。然后，您需要修改 CSS 文件以使用此嵌入字符串，而不是指向单独的字体文件。

这可以通过改变来完成：

@font-face {
  font-family: 'Elusive-Icons';
  src: url('../res/fonts/elusive-icons.ttf') format('truetype'),
       url('../res/fonts/elusive-icons.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

收件人：

@font-face {
  font-family: 'Elusive-Icons';
  src: url('data:application/octet-stream;base64,*Truetype Base 64 encoded string here*') format('truetype'),
       url('data:application/octet-stream;base64,*Opentype Base 64 encoded string here*') format('opentype');
  font-weight: normal;
  font-style: normal;
}

工作 JS 小提琴： https://jsfiddle.net/btxdpgvy/1/

【讨论】：

【解决方案2】：

经过一番研究，我找到了this article。

构建器不会复制res 文件夹中的文件，只会复制您在配置文件中链接到的文件。

所以通过将/fonts 文件夹移动到我的css 文件夹，问题就解决了。

【讨论】：