Лицо шрифта в соответствии с языком

Случай:
У меня есть вопросник 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;}

но каждый раз шрифт мангал переопределяется. я хочу использовать freeserif для английского контента и mangal для не английского контента.

Есть лучший способ сделать это?

-1

Решение

Вы можете ориентироваться на разные языки в CSS, если вы используете правильные языковые атрибуты в html (как вы должны)

[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>
0

Другие решения

Других решений пока нет …

По вопросам рекламы [email protected]