如何为 @font-face 正确解析 Devanagari / Hindi

Question

从这个字符串开始：

वृत्तयः पञ्चतय्यः क्लिष्टाक्लिष्टा

我正在尝试在我的移动设备上呈现它（通过 Cordova / PhoneGap）。

在我的浏览器 ( localhost:8000 ) 上，它显示正常。正如示例中显示的那样。但在我的设备上，它看起来像这样：

它肯定采用了我的字体 (Karma-Light)，因为我注意到别名比默认的 Helvetica、sans-serif 等更好

我的 CSS 看起来像这样：

@font-face {
    font-family: 'Karma';
    src: local('Karma'), url('../fonts/Karma-Light.ttf') format('truetype');
    unicode-range: U+0900–097F;
    font-weight: normal;
    font-style: normal;
}

.devanagari { font-family: 'Karma', Helvetica, Arial, sans-serif; }

我尝试了各种不同的 unicode-ranges，也尝试了省略 unicode-range，但一切都以相同的方式显示。

有什么想法吗？

Answer 1

以防有人卡在这里！

在你的/src/

中打开你的index.html

并确保它是这样写的！

<meta charset="utf-8" name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">

声明字符集使其工作。

如何为 @font-face 正确解析 Devanagari / Hindi

How to properly parse Devanagari / Hindi for @font-face

css

unicode

fonts

font-face

cordova