slogin.info

ihc 468x60 1 1
Звезда не активнаЗвезда не активнаЗвезда не активнаЗвезда не активнаЗвезда не активна0 / 5
 
Автор: Администратор
Просмотров: 1190
Теги: меню, menu, ul li

В этой статье мы расскажем о том, как сделать многоуровневое вертикальное меню. 

Начнём с основ, все мы знаем как делаются простые одноуровневые меню через HTML. По сути такое меню представляет из себя обычный <ul> список, элементами которого являются пункты меню-ссылки. Пример такого простого меню:

<ul>
	<li><a href="/">Первый пункт</a></li>
	<li><a href="/">Второй пункт</a></li>
	<li><a href="/">Третий пункт</a></li>
	<li><a href="/">Четвертый пункт</a></li>
</ul>

В случае, когда мы хотим сделать многоуровневое меню, то нужно так же сделать многоуровневый список. А делается он по следующему принципу, в том <li>, в котором должны быть подпункту меню добавляют ещё одно одноуровневое меню <ul>. В итоге у вас по-умолчанию будет получается вертикальное многоуровневое меню.

Давайте рассмотрим пример:

<ul>
	<li><a href="/">Первый пункт</a>
		<ul>
			<li><a href="/">1.1</a></li>
			<li><a href="/">1.2</a></li>
			<li><a href="/">1.3</a></li>
		</ul>
	</li>
	<li><a href="/">Второй пункт</a></li>
	<li><a href="/">Третий пункт</a>
		<ul>
			<li><a href="/">3.1</a></li>
			<li><a href="/">3.2</a></li>
			<li><a href="/">3.3</a></li>
		</ul>
	</li>
	<li><a href="/">Четвертый пункт</a></li>
</ul>

А вот так это будет выглядеть:

Добавить комментарий

Авторизоваться с помощью:

     


Защитный код
Обновить

Поиск по сайту

Топ 10 активных пользователей

  • Имя пользователя Баллы
  • gawk
    44.20
  • hr@proovelab
    15.00
  • intuit89
    6.00
  • Varvarka
    4.00
  • ZOMRO
    3.20
  • Akyla58
    3.00
  • AnnaOl
    3.00
  • dimasik_3557
    3.00
  • ErcardSa
    3.00
  • Galinamuh
    3.00
 

Рекламные ссылки

IHC

Пожертвования

icon donate

Yandex.Money: 410011571748395

Webmoney:

R362907776401 (Рубли)

Z410919458006 (Доллары)

ihc 468x60 1 1

Похожие материалы

Фиксированное меню при прокрутке страницы

Довольно часто появляется необходимость зафиксировать какой-то блок, меню, или просто картинку при прокрутке страницы. Наприме, у нас так справа зафиксированно предложение к вступлению в команду поддержки сайта.

Теги:

position, menu, ul li, fixed

Комментариев: 0 Подробнее
Создаем многоуровневый, вложенный список

В этой статье мы расскажем о том, как сделать многоуровневый список, или другими словами - вложенный.

Теги:

html, ul li, список, list

Комментариев: 0 Подробнее
Цвет маркеров, разный цвет для текста и маркеров списка

В этой статье мы расскажем о том, как задать цвет маркерам списка, а так же о том, как задать различный цвет для текста пунктов списка и маркеров.

Теги:

css, html, ul li, list, marker

Комментариев: 0 Подробнее

Последнее с форума

Urii-Polyakov-odnoklassniki аватар
Мы – команда разработчиков, дизайнеров и SEO-специалистов, которая любит свое дело и умеет создавать...
Перейти в тему
ZOMRO аватар
Оптимальные VDS/VPS Это сбалансированное предложение в соотношение цена-качество-количество ресурсо...
Перейти в тему
ZOMRO аватар
Скидка 50% на первый месяц Хотите получить уникальную скидку 50% на первый месяц пользования нашим ...
Перейти в тему

Последние статьи

Javascript функции

Функции - одна из основных концепций языка JavaScript. При этом есть кардинальное отличие от многих языков программирования, в JS каждая функция сама по себе является объектом, а соответственно и манипулировать с ней можно разными способами:

Ссылка на телефон

В этой статье мы рассмотрим простой и обычный способ создания ссылки на телефон.

CPA сети 30.01.2017
CPA сети

Сегодня мы подробно рассмотрим тему зарабатка на своих проектах (т.е. это не обязательно сайты) при помощи CPA сетей.