【问题标题】:Custom font working on android emulator but not on device. (Phonegap)自定义字体适用于 android 模拟器但不适用于设备。 (电话间隙)
【发布时间】:2014-02-28 18:53:14
【问题描述】:

我目前正在构建一个 Phonegap 应用程序,并且我正在尝试使用 css 包含字体,如下所示:

@font-face {
    font-family: "ostrich";
    src: url("fonts/Ostrich.ttf") format("truetype"); 
}

这适用于我在运行 Android 4.4.2 的 Nexus S 上运行的模拟器,但它不适用于运行 Android 4.3 的物理三星 S3。

我试图通过将我的字体文件夹复制到我的资产目录并以“file:///android_asset/fonts/Ostrich.ttf”的形式访问它来修复它,这似乎再次在我的模拟器中工作,但是不在我的设备上。

我可能做错了什么,但如果这是一个错误,那么解决这个问题的方法是什么?非常感谢您的帮助。

非常感谢。

编辑 1: 我已经在 StackOverflow 中浏览了很多试图解决这个问题的问题。我注意到他们链接最多的是这个how use custom fonts in phonegap - 但是他们提到它似乎不适用于Android 4+,但它确实在我的模拟器中工作,它在我的物理设备上不起作用。 ..

【问题讨论】:

  • 如果您还没有,请尝试将您的 css 放入 /css 并将您的字体文件放入 /fonts,然后在您的 css 中使用 ../fonts/ 引用您的字体文件
  • 道森晚安 - 非常感谢您的回复。我实际上已经尝试过了,不幸的是,它再次在我的模拟器上工作,但在我的设备上却没有......你认为问题出在我的设备上吗?
  • 通常在 Android 中这类问题与路径有关,但听起来这可能是文件类型问题。你的字体有其他文件类型吗?我刚刚检查了我的最新项目,设计师包括.svg, .ttf and .woff。在 Android 上检查应用程序时,我看到 webview 正在选择 .woff 文件进行显示。
  • 我刚刚尝试包含 woff、svg、ttf 和 otf,但没有成功 - 我很确定路径存在问题,但我不知道为什么这不起作用:/但它实际上完美地在模拟器上工作......如帖子中所述,我也尝试从文件中引用它们:///android_asset/fonts 但它不起作用(我确实将字体文件夹复制到 assets/ 文件夹下到资产/www/...

标签: android css cordova fonts


【解决方案1】:

在与我的手机搏斗了几个小时后,我发现了this answer,这基本上表明 Android 4.3 存在一个错误,这让我很头疼。令人惊讶的是,解决方法很简单,您只需使用 @media only 屏幕 {} 和 include svg fonts 来包装您的字体。应该这样做:)

非常感谢,祝你好运。希望如果您遇到此问题,您可以比我更快地找到此答案。

【讨论】:

    猜你喜欢
    • 2012-10-30
    • 2021-02-15
    • 1970-01-01
    • 1970-01-01
    • 2012-11-01
    • 2011-03-08
    • 2015-02-13
    • 2011-03-20
    • 1970-01-01
    相关资源
    最近更新 更多