Как в scss подгружать шрифты для разных языков?

Ссылка скопирована
1 ответ

Реально ли это сделать?
HTML документ имеет
<html lang="ru">
или
<html lang="en">
Мне нужно для русскоязычной и англоязычной аудитории подгружать разные шрифты
Сейчас шрифты подгружаются следующим образом

@font-face {   font-family: NAME;   font-weight: 700;   font-style: normal;   font-display: swap;   src: local("NAME-Bold"), url(/NAME-Bold.woff2), url(/NAME-Bold.woff), url(/NAME-Bold.ttf) } .....

@font-face { font-family: NAME; font-weight: 700; font-style: normal; font-display: swap; src: local("NAME-Bold"), url(/NAME-Bold.woff2), url(/NAME-Bold.woff), url(/NAME-Bold.ttf) } .....

Дополнительно:

Как меняется lang?
Вот там и подключать нужный файл стилей шрифтов по языку.

Почитайте про unicode-range, браузер сам разберется.
Краткая суть такая: если на странице нет символов из указанного диапазона, то шрифт не загружается. Если же есть хоть один символ, то загрузится весь шрифт.

https://developer.mozilla.org/en-US/docs/Web/CSS/@...

Нужно решить такую задачу?

Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.

Заказать помощь
Лучший ответ
1
Дмитрий К. Ответ

Для загрузки шрифтов для разных языков в SCSS, вы можете использовать функцию `@font-face` и указать различные шрифты для разных языков.

Например, если у вас есть разные шрифты для английского и китайского языков, вы можете создать следующий SCSS код:

@font-face {
  font-family: 'EnglishFont';
  src: url('englishFont.woff') format('woff');
}
 
@font-face {
  font-family: 'ChineseFont';
  src: url('chineseFont.woff') format('woff');
}
 
body {
  font-family: 'EnglishFont', sans-serif;
}
 
.chinese-text {
  font-family: 'ChineseFont', sans-serif;
}

@font-face { font-family: 'EnglishFont'; src: url('englishFont.woff') format('woff'); } @font-face { font-family: 'ChineseFont'; src: url('chineseFont.woff') format('woff'); } body { font-family: 'EnglishFont', sans-serif; } .chinese-text { font-family: 'ChineseFont', sans-serif; }

В приведенном примере мы определяем два разных шрифта - `EnglishFont` и `ChineseFont`, и применяем их к соответствующим элементам. Для текста на английском языке будет использоваться шрифт `EnglishFont`, а для текста на китайском языке - шрифт `ChineseFont`.

Вы также можете использовать различные форматы шрифтов, такие как `woff`, `woff2`, `ttf`, в зависимости от ваших потребностей.

Не забудьте подключить ваши шрифты в HTML файле с помощью тега `link` или другими способами, чтобы они были доступны для загрузки в вашем веб-приложении.

Другие ответы (0)

Пока нет других ответов. Будьте первым, кто поможет автору.

Ответить на вопрос

комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Вам также может быть интересно