Question

案例： 我有问题文件html我的页眉，页脚和一些标题是英语和问题，选项和答案文本将使用不同的语言，英语或印地语或马拉地语。所有数据都来自数据库。我有三种字体可用freeserif，freeserifbold和mangal。

问题我想将freeserif字体应用于英文内容，freeserif粗体字体用于粗体文本，mangal字体用于非英文内容。我做的是

@font-face {
        font-family: FreeSerif;
        src: url("<?= asset_url('fonts', 'FreeSerif.ttf'); ?>");
    }
    @font-face {
        font-family: FreeSerif;
        src: url("<?= asset_url('fonts', 'FreeSerifBold.ttf'); ?>");
        font-weight: bold;
    }
    @font-face {
        font-family: Mangal;
        src: url("<?= asset_url('fonts', 'mangal.ttf'); ?>");
    }
    body, html, font, * {padding: 0;margin: 0;font-family:"FreeSerif" !important;font-size:14px;}

但每次mangal字体都被覆盖。我想使用freeserif用于英语内容，使用mangal用于非英语内容。

有更好的方法吗？

Answer 1

如果你在html中使用正确的语言属性（你应该这样做），你可以在CSS中定位不同的语言

[lang="en"] {
  font-family: sans-serif
}

[lang="ne"] {
  font-family: serif;
}

<div>
  <p lang="en">this is english</p>
  <p lang="ne">and this is Nepali</p>
</div>

根据语言字体

1 个答案: