FontAwesome使用cordova / phonegap在WP8上显示为正方形

时间:2014-08-15 15:56:19

标签: cordova windows-phone-8 angular-ui-bootstrap font-awesome

我正在使用AngularMobileUI框架,图标只显示为方块。我之前尝试过Ionic框架并且做了同样的事情。

任何人都知道如何解决这个问题,以及它为什么会发生?

我的图标在android和ios上显示正常

1 个答案:

答案 0 :(得分:14)

让某人有这个问题,我在这里找到了部分答案

Getting a web-font to work on an HTML5 Windows Phone App?

FontAwesome将embeddable标志设置为4.首先,您需要将值设置为零。完成后,您需要更改css并在加载字体文件时删除查询字符串。

@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.eot?v=4.1.0');
  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.1.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.1.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.1.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

变为

@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.eot?v=4.1.0');
  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.1.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.1.0') format('woff'), url('../fonts/fontawesome-webfont.ttf') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

我刚从ttf文件中删除了查询字符串,因为在android和ios上,这似乎并不重要。

希望这有助于某人