Thaana字体在移动Web浏览器上

时间:2014-02-16 18:15:28

标签: android css iphone fonts bidi

我正在使用一种名为Dhivehi(Maldivian)的小语言的字体。字母表称为“Thaana”。有许多可用的Unicode字体(例如Microsoft的MV Boli)。它是从右到左书写的。 虽然它在笔记本电脑上的网络浏览器上看起来很完美,但它在基于手机的浏览器上却无法正确显示。

我正在使用以下CSS代码来应用字体:

@font-face {
font-family: 'Eamaan';
src: url('http://www.sun.mv/css/MvEamaanXP.ttf') format('truetype');
}

.thaana{direction:rtl; float:right; unicode-bidi: bidi-override;font-size:16pt;
                float: left;font-family:"Eamaan"; padding:2%;}

对于我的HTML,我使用以下内容:

<p class="thaana">މިއީ ހަމަ ރަގަޅު ކަމެކެވެ</p>

这会在网络浏览器上产生清晰的写作,但在任何基于手机的浏览器上它都不起作用(对我而言)。

任何帮助都将不胜感激。

1 个答案:

答案 0 :(得分:2)

我想知道问题是否使用了真实字体。 Chrome(Blink)和WebKit浏览器(Android股票)应该支持true-type,但是当我在桌面上的Chrome中运行此代码时,我看不到Eamaan被渲染。

This site使用Waheed,他们使用的是开放式字体版本,可以在Chrome中呈现。如果您的font-face规则的网址中提供了Eamaan的开放式字体,我建议您添加该字体。

示例:

@font-face {
    font-family: 'Eamaan';
        src: url('http://www.sun.mv/css/MvEamaanXP.ttf') format('truetype'),
            url('http://www.sun.mv/css/MvEamaanXP.otf') format('opentype');
}

您可能希望进一步扩展以包含.eot.woff.svg,以获得对font-face的完全支持:

@font-face {
    font-family: 'MyWebFont';
    src: url('webfont.eot'); /* IE9 Compat Modes */
    src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('webfont.woff') format('woff'), /* Modern Browsers */
        url('webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
        url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */
}