Но перед тем как начнем - быстро взглянем на подключение шрифтов

Google Fonts

Одной из первых задач написания стилей является подключение нужных шрифтов. Сделать сейчас это можно очень просто - с помощью сервиса Google Fonts.

Просто выбираем нужный шрифт, можно выбирать сразу несколько, отмечаем какие нужны начертания - справа в углу копируем код и добавляем прямо в файл style.css

@import url('<https://fonts.googleapis.com/css2?family=Roboto:wght@500;700;900&display=swap>');

А ниже применяем этот шрифт к тем классам или тегам (подробнее про шрифты). Например, ко всему документу

body {
	font-family: 'Roboto', sans-serif;
}

Ваша задача

  1. Добавьте любой шрифт из Google Fonts для вашего будушего сайта
  2. Не тратьте на выбор больше 10 минут, шрифт всегда можно поменять

Начнем верстать

Для начала мы сделаем верстку для шапки (хедера header)

<header>- новый тег. В это макете все в body делится на 3 части: header, main, footer. Подробнее мы ещё будем о них говорить, а пока давайте рассмотрим один из них.

<header> - тег для обозначения верхней части сайта, обычно содержит логотип, навигацию (меню), кнопки входа в личный кабинет и тд. <nav> - тег, содержащий блок с навигацией по сайту.