Чтобы создать боковое меню на HTML-странице с помощью CSS, можно использовать свойства position, width, height и background-color.
Вот пример HTML-кода, который создает контейнер для бокового меню:
<div class="sidebar">
<ul>
<li><a href="#">Пункт меню 1</a></li>
<li><a href="#">Пункт меню 2</a></li>
<li><a href="#">Пункт меню 3</a></li>
</ul>
</div>
Здесь мы создали элемент <div> с классом sidebar, который будет содержать боковое меню. Внутри него мы создали элемент <ul>, содержащий пункты меню, каждый из которых является элементом <li> с ссылкой внутри.
Чтобы сделать боковое меню видимым на странице, можно использовать следующий CSS-код:
.sidebar {
position: fixed;
top: 0;
left: 0;
width: 200px;
height: 100%;
background-color: #ccc;
}
ul {
list-style: none;
margin: 0;
padding: 0;
}
li {
margin: 10px 0;
}
a {
display: block;
padding: 5px;
}
Здесь мы задали класс .sidebar для контейнера бокового меню и использовали свойства position: fixed, чтобы задать фиксированное положение меню на странице, top: 0 и left: 0, чтобы выровнять меню по левому краю страницы.
Также мы использовали свойства width и height, чтобы задать размеры меню, и background-color, чтобы задать цвет фона.
Чтобы сделать список меню читабельным, мы установили свойство list-style: none, чтобы убрать маркеры списка, margin: 0 и padding: 0, чтобы убрать отступы, и display: block для ссылок, чтобы они занимали всю ширину блока. Мы также задали отступ для каждого пункта меню с помощью свойства margin.
Вы можете изменять значения свойств CSS для создания бокового меню со своим уникальным дизайном и стилем.





