Обобщенное правило для шрифтов в CSS - это мощный инструмент, позволяющий быстро и легко установить стили шрифтов для всех элементов на веб-странице. Это особенно полезно для поддержания единого визуального стиля.

В этом уроке мы рассмотрим использование обобщенных правил для установки стандартных шрифтов на веб-странице.

Определение Обобщенных Правил

HTML

<p class="generic-font">Этот текст использует обобщенное правило для шрифта.</p>

CSS

body {
   font-family: Arial, sans-serif; /* Обобщенное правило для установки шрифта на всей странице */
}

Установив шрифт для тега body, вы определяете обобщенное правило, которое будет применяться ко всем элементам на странице, если для них явно не указан другой шрифт.

Значение sans-serif в обобщенных правилах

HTML

<p class="sans-serif-font">Текст с использованием обобщенного правила sans-serif.</p>

CSS

body {
   font-family: sans-serif; /* Обобщенное правило для использования шрифта без засечек на всей странице */
}

Используя sans-serif в обобщенных правилах, вы гарантируете использование шрифта без засечек, что может быть полезно для обеспечения единообразия в стиле.

Важный момент. Обобщенные правила удобны для установки единого стиля шрифтов на всей странице, но помните, что иногда желательно явно указывать шрифты для отдельных элементов для более точного контроля над дизайном.

Использование Google Fonts в обобщенных правилах

HTML

<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap">
<p class="google-fonts">Текст с использованием шрифта Roboto из Google Fonts.</p>

CSS

body {
   font-family: 'Roboto', sans-serif; /* Обобщенное правило для использования шрифта Roboto на всей странице */
}

Вы можете использовать внешние источники шрифтов, такие как Google Fonts, в обобщенных правилах для подключения разнообразия и качественного дизайна.

Заключение

Обобщенные правила для шрифтов - это отличный способ обеспечить единообразие в визуальном стиле вашей веб-страницы. Это удобное средство для быстрой установки шрифтов на всей странице. Однако помните о возможности явного указания шрифтов для отдельных элементов для тонкой настройки вашего дизайна.