Создаем сайт сами | Как создать горизонтальное и вертикальное меню на основе одного списка.

Видеоуроки

Создание вертикального и горизонтального меню на основе одного списка
дата: 13.01.2008

Урок посвящен созданию вертикального и горизонтального меню на основе обычного списка.

HTML-код списка:

<ul id="menu">
<li><a href="#">Home</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Members</a></li>
<li><a href="#">Achievements</a></li>
<li><a href="#">News</a></li>
<li><a href="#">Contact</a></li>
</ul>

С помощью одних CSS-правил список можно представить в виде горизонтального меню, с помощью других — список можно представить в виде вертикального меню (при наведении курсора мыши на ссылку реализована смена маркера). Посмотреть пример меню в двух вариантах.

Таким образом, этот способ позволяет кардинально менять внешнее оформление меню без правки его HTML-кода.

Длительность видеоурока —  19 мин. 36 сек. Он упакован в RAR архив menu_creation.rar и занимает 12.23 мб.

Для просмотра урока необходим Flash Player (от 7 версии и выше).

Как скачать

Ссылки

Статьи
Блочная верстка сайтов
Контент для сайта