Для подключения шрифтов из Google Fonts в CSS необходимо выполнить следующие шаги:
- Открыть сайт Google Fonts по ссылке https://fonts.google.com/
- Выбрать нужный шрифт, нажать на кнопку «Select this font»
- Настроить параметры шрифта (стиль, вес, размер и т.д.)
- Скопировать код подключения шрифта в секции «Embed Font»
- Вставить код в секциюhead> вашего HTML-документа:
<head>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
</head>
- Добавить свойство font-family в CSS-стили для нужных элементов:
body {
font-family: 'Roboto', sans-serif;
}
В данном примере шрифт Roboto подключается с весами 400 и 700. Если нужно подключить несколько шрифтов, их можно указать через запятую в параметре «family» в коде подключения. Например:
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&family=Open+Sans:wght@400;700&display=swap" rel="stylesheet">
В этом случае подключаются шрифты Roboto и Open Sans с весами 400 и 700.