html - 如何在 PhoneGap 中添加自定义字体

Question

我正在尝试向我的 PhoneGap 应用程序添加自定义字体，我尝试了两种在互联网上找到的方法，但它们在 PhoneGap 3 和 Xcode 5 上不起作用。

• 使用 font-face 方法使用 CSS:

  @font-face {
             font-family: 'Droid Arabic Kufi';
             src: url('fonts/DroidKufi-Regular.ttf');
           }
  
  body {
       font-family: 'Droid Arabic Kufi';
     }
  

  使用Xcode info.plist文件方法:

  1. 首先我在元素资源文件夹中添加了DroidKufi-Regular.ttf。

  2. 然后在名为 Fonts provided by application 的 info.plist 文件中添加了一个名为 DroidKufi-Regular.ttf 的新行>。仍然不起作用。

  3. 因此，我在 viewDidLoad 方法中添加了这行代码 [UIFont fontWithName:@"Droid Arabic Kufi"size:10.0]; 但仍然无法正常工作。

     <

Answer 1

这适用于我的应用程序。 'fonts' 是包含 css 文件的目录中的子目录。

@font-face {
    font-family: 'grenouille';
    src: url('fonts/grenouille.eot');
    src: local('☺'), url('fonts/grenouille.woff') format('woff'), url('fonts/grenouille.ttf') format('truetype'), url('fonts/grenouille.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

h1 {
    font-family: "grenouille";
}

我不确定您是否需要所有这些文件，但您可以使用站点 http://www.fontsquirrel.com/tools/webfont-generator 生成它们

如果您仍然遇到问题，请检查字母大小写，从名称中删除空格并尝试应用预安装的字体系列以确保您的问题是字体而不是 css 规则。