Добрый день. В этой статье рассмотрим как просто подключить любой шрифт на Ваш сайт. Итак, приступим...
Подключаем шрифт google на сайт
Для начала, по традиции, создаем файл test.html и style.css в любой из папок Вашего ПК.
Открываем Ваш файл test.html и в самом верху подключаем стили нашей странички таким кодом:
<head>
<link rel="stylesheet" href="style.css">
</head>
Далее, открываем сайт со шрифтами https://fonts.google.com/, выбираем любой понравившийся, и жмем на него. Открывается такая страница.
В правом верхнем углу жмем на знак 3 квадрата и +, справа открывается всплывающее окно.
Выбираем чекбокс @import. Если выбрать чекбокс link, то шрифт можно встроить в сам html документ сайта.
Нас интересует весь код внутри style
@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@700&family=Merriweather&display=swap');
Вставляем этот код в наш файл style.css в самый верх.
Шрифт мы импортировали. И тут же сразу можно в тег body прописать шрифт для всего нашего сайта.
body {
font-family: 'Caveat', cursive;
}
Таким образом любой шрифт можно использовать в любом блоке нашего сайта.
Старайтесь не подключать больше количество сторонних шрифтов, т.к. это нагружает сам сайт.
Вот такой шрифт мы подключили в этой статье..