Чтобы сделать фиксированную (закрепленную) шапку сайта в CSS, можно использовать свойство position: fixed;.
Вот пример кода, который создаст фиксированную шапку с заданным фоновым цветом и размером высоты:
header {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 60px;
background-color: #333;
color: #fff;
}
position: fixed;задает, что элемент должен быть расположен в фиксированном положении на странице.top: 0; left: 0;указывают координаты верхнего левого угла элемента, от которых будет начинаться позиционирование элемента.width: 100%;делает ширину элемента равной 100% ширины родительского элемента (обычно этоbody).height: 60px;задает высоту элемента (в данном случае, 60 пикселей).background-color: #333;устанавливает цвет фона элемента.color: #fff;устанавливает цвет текста внутри элемента.
Помните, что фиксированная шапка может перекрывать другие элементы, поэтому обычно для нее добавляется отступ сверху для перемещения следующего контента вниз:
body {
padding-top: 60px; /* высота шапки */
}
С помощью padding-top мы добавляем отступ сверху для перемещения тела страницы вниз на высоту шапки.





