Чтобы создать хедер (верхнюю часть страницы) в CSS, можно использовать следующий код:
HTML:
<header>
<div class="container">
<h1>Логотип</h1>
<nav>
<ul>
<li><a href="#">Главная</a></li>
<li><a href="#">О нас</a></li>
<li><a href="#">Контакты</a></li>
</ul>
</nav>
</div>
</header>
CSS:
header {
background-color: #333;
color: #fff;
padding: 20px 0;
}
.container {
max-width: 1200px;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: center;
}
h1 {
font-size: 24px;
margin: 0;
}
ul {
list-style: none;
margin: 0;
padding: 0;
display: flex;
}
ul li + li {
margin-left: 20px;
}
a {
color: #fff;
text-decoration: none;
}
Этот код создает хедер, который включает логотип и навигационное меню.
Отметим, что для создания хедера мы использовали элемент <header>, которому присвоили стили CSS. Затем мы создали область контейнера, задав максимальную ширину, выравнивание и отступы. Для логотипа мы задали размер шрифта, а для навигации — список ul с помощью display: flex;, чтобы заставить элементы выравниваться по горизонтали.
Кроме того, мы использовали свойства background-color и color, чтобы задать задний фон и цвет текста. Мы также добавили padding, чтобы создать отступы верхней и нижней части хедера.
Навигационное меню можно оформить различными способами, включая выпадающие меню, анимации и др.
Надеюсь, этот ответ поможет вам создать простой хедер в CSS.