Создаем сайт сами | Как создать горизонтальное и вертикальное меню на основе одного списка.
Видеоуроки
- Создание вертикального и горизонтального меню на основе одного списка
дата: 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 версии и выше).
- Как скачать
- Статьи
-
Блочная верстка сайтов
- Какой стандарт предпочтительнее выбрать при создании нового сайта? Отличия XHTML от HTML.
- Филоcофия CSS-дизайна. Позаботьтесь о красоте HTML-разметки.
- Почему XHTML+CSS? 15 доводов в пользу перехода на XHTML+CSS.
- Как декларация DOCTYPE влияет на отображение сайта браузерами?
- Как проверить сайт на кроссбраузерную совместимость?
- Как «угодить» IE6, IE7? Пишем хаки для Internet Explorer.
- Недостатки меню на javascript. Из опыта создания ниспадающих меню в NavStudio.
- Зачем нужна печатная версия сайта. Как создать печатную CSS-версию?
Контент для сайта