为两种不同的语言使用单独的字体

时间:2014-09-26 05:35:43

标签: html css fonts font-face

我试图为两种不同的语言使用两种不同的字体。但是这两种字体彼此重叠,因此难以阅读文本。这是我正在尝试的;

CSS:

@font-face {
       font-family: 'Jameel Noori Nastaleeq';
       src: url(../../../fonts/Jameel Noori Nastaleeq.ttf)
}

然后在我编写text的区域中使用了这个CSS类:

CSS:

.post_body {
    padding: 5px;
    font-size: 17px;
    font-family: Tahoma, Jameel Noori Nastaleeq;
}

问题是,当我在帖子中使用URDU文字时,它会显示正确的字体样式,但是当我使用ENGLISH文字时,它不会使用Tahoma字体样式

请帮助您了解如何在同一区域内使用两种不同语言的两种不同字体样式?

1 个答案:

答案 0 :(得分:1)

首先应该设置html的语言......或元素的语言。

<!-- html -->
<html lang="en">


/* CSS */
.post_body {
    /* common style stuff -- don't set font-family here */
}

:lang(en) .post_body {
    font-family : Tahoma;
}

然后使用JS更改document.documentElement.lang属性。

当然,这就是整个页面正在改变语言。

如果您想同时在乌尔都语中发布一些帖子,并在英语中发布一些帖子,请设置

<article class="post_body" lang="en">

.post_body:lang(en) { font-family : Tahoma; }