CSS Fonts

Этот перевод не завершён. Пожалуйста, помогите перевести эту статью с английского

CSS Fonts - модуль в CSS, который определяет свойства связанные со шрифтами и как шрифтовые ресурсы загружаются. Модуль позволяет вам задать стиль шрифта, вроде font-family, font-size и font-weight, lineheight и варианты отображения знаков, когда для одного доступны сразу несколько

Базовый пример

Следующий пример показывает простое использование шрифтовых свойств, стилизующих тэг <p>.

p {
  width: 600px;
  margin: 0 auto;
  font-family: "Helvetica Neue", "Arial", sans-serif;
  font-style: italic;
  font-weight: 100;
  font-variant-ligatures: normal;
  font-size: 2rem;
  letter-spacing: 1px;
}
<p>Three hundred years ago<br>
  I thought I might get some sleep<br>
  I stretched myself out onna antique bed<br>
  An' my spirit did a midnite creep</p>

Вывод на экран будет следующим:

Различные примеры шрифтов

Вы можете найти множетсво вариантов шрифтов на v-fonts.com и axis-praxis.org; так же смотрите наше руководство Variable fonts для большей информации по использованию.

Отсылки

Properties

At-rules

@font-face
@font-feature-values

Руководство

Fundamental text and font styling
В этой обучающей статье для новичков мы детально описываем основы стилизации текста/шрифта, включая определение жирности начертания, вида шрифта и стилей, рассматриваем сокращённую запись свойства font, декорации текста и другие эффекты, а так же межстрочные и межбуквенные интервалы.
OpenType font features guide
Особенности шрифтов или их варианты ссылаются на различные стили символов или букв, содержащиеся в OpenType. Руководство описывает такие вещи как лигатура (специальные символы объединяющие буквы вроде 'fi' или 'ffl'), кернинг (то, как свободное место распределяется между различными символами) и другое. Всё перечисленное относится к особенностям OpenType и позволяет использовать в вэбе специальные свойства и свойства контроля нижнего уровня font-feature-settings. В статье есть всё, что вам нужно знать об особенностях OpenType шрифтов в CSS.
Variable fonts guide
Variable fonts are an evolution of the OpenType font specification that enables many different variations of a typeface to be incorporated into a single file, rather than having a separate font file for every width, weight, or style. This article will give you all you need to know to get you started using variable fonts.

Specifications

Specification Status Comment
CSS Fonts Module Level 4 Рабочий черновик Adds font-variation-settings (and related higher-level properties) and font-optical-sizing.
CSS Fonts Module Level 3 Кандидат в рекомендации Adds font-feature-settings (and related higher-level properties)
CSS Level 2 (Revision 1) Рекомендация
CSS Level 1 Рекомендация Initial definition