Нужно ли при добавлении семейства шрифтов с помощью @font-face указывать значения по умолчанию для font-weight и font-style?
Есть ли какие-то преимущества второго варианта над первым? В чём отличие? Какой вариант использовать?
Первый вариант:
@font-face { /* Обычное начертание */
font-family: "Exo";
src: url("path/to/file.woff2") format("woff2"),
url("path/to/file.woff") format("woff");
}
@font-face { /* Курсивное начертание */
font-family: "Exo";
src: url("path/to/file.woff2") format("woff2"),
url("path/to/file.woff") format("woff");
font-style: italic;
}
@font-face { /* Полужирное курсивное начертание */
font-family: "Exo";
src: url("path/to/file.woff2") format("woff2"),
url("path/to/file.woff") format("woff");
font-weight: 700;
font-style: italic;
}
Второй вариант:
@font-face { /* Обычное начертание */
font-family: "Exo";
src: url("path/to/file.woff2") format("woff2"),
url("path/to/file.woff") format("woff");
font-weight: 400;
font-style: normal;
}
@font-face { /* Курсивное начертание */
font-family: "Exo";
src: url("path/to/file.woff2") format("woff2"),
url("path/to/file.woff") format("woff");
font-weight: 400;
font-style: italic;
}
@font-face { /* Полужирное курсивное начертание */
font-family: "Exo";
src: url("path/to/file.woff2") format("woff2"),
url("path/to/file.woff") format("woff");
font-weight: 700;
font-style: italic;
}
Ответы (1 шт):
Автор решения: markak
→ Ссылка
Лучше загрузите ttf на https://www.fontsquirrel.com/tools/webfont-generator или другой генератор и работайте со сгенерированным кодом.
Подробное введение по работе со шрифтами: https://developer.mozilla.org/ru/docs/Learn/CSS/Styling_text/Web_fonts