System Fonts

Опис

Системні шрифти запитує таблицю стилів, яка дозволяє використовувати нативний шрифт у кожній операційній системі і визначає system-ui css @font-face, який ви можете використовувати у налаштувачі, налаштуваннях вашої теми або у власному коді.

Приклад використання

Тема Twenty Seventeen використовує цей css-селектор для основного тексту:

body, button, input, select, textarea {
  font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;
}

Ми замінимо його на системний шрифт за замовчуванням.
На вашому сайті WordPress перейдіть до Зовнішній вигляд > Налаштування > Додаткового CSS і вставте цей код

body, button, input, select, textarea {
  font-family: system-ui;
}

Крім них, доступні й інші властивості шрифтів:

• font-style: звичайний або курсив;
• font-weight: 300 (тонкий), 400 (звичайний), 500 (середній), 700 (жирний);

Наприклад, це код, який робить текст елемента напівжирним і курсивним:

#my-element {
  font-family: system-ui;
  font-weight: 500;
  font-style: italic;
}