Боковое меню html

Разместить меню сбоку страницы достаточно просто.Под боковым меню я подразумеваю меню,которое будет "приклеено" к правой или левой стороне окна браузера.
Достигается такой эффект средствами CSS. Достаточно всего одного свойства-position.
Рассмотрим на примере простейшее меню, обернутое в див и состоящее из 5 ссылок.
html
<div id="menu">
	<a href="#">ссылка 1</a>
	<a href="#">ссылка 2</a>
	<a href="#">ссылка 3</a>
	<a href="#">ссылка 4</a>
	<a href="#">ссылка 5</a>
</div> 

css
#menu{
	position:fixed;
	left:20px;
	top:50%;
	border:1px solid black;
	width:120px;
}

Значение fixed свойства position - закрепит меню на странице.

Свойство left означает отступ слева в 20 пикселей и top - отступ сверху в 50% высоты окна браузера, тоесть посередине.
Такое меню, например используется для формирования рекламного блока на сайте tak.ru.Также меню обернуто в рамку и имеет ширину в 120 пикселей.

Если использовать свойство right, вместо left - то его значение будет отступом справа. Аналогично свойство bottom против top.
Теги:
меню
Добавлено: 04 Апреля 2018 11:20:21 Добавил: Андрей Ковальчук Нравится 0
Добавить
Комментарии:
Нету комментариев для вывода...