4 356 Скрипты / Menu & Nav

Горизонтальное меню на CSS3

Симпатичное горизонтальное CSS3 меню с всплывающими пунктами при наведении.

HTML

Разметка сразу двух вариантов меню.

Заметьте, что в первом ваарианте у нас пункты меню представляют из себя иконки, которые реализованы посредством подключения в CSS файле стилей шрифта LigatureSymbols.

<nav>
    <ul>
        <li><a href="#">&#xe008;</a></li>
        <li><a href="#">&#xe105;</a></li>
        <li><a href="#">&#xe072;</a></li>
        <li><a href="#">&#xe12f;</a></li>
    </ul>
</nav>
<nav class="menu2">
    <ul>
        <li><a href="#">Главная</a></li>
        <li><a href="#">О нас</a></li>
        <li><a class="selected" href="#">Контакты</a></li>
        <li><a href="#">Блог</a></li>
    </ul>
</nav>

CSS

Подключаем шрифт с иконками, но это необходимо только для нашей демонстрации, у вас иконок может и не быть.

Скачать 2073Загрузок 155,14 Kb
Демо

Комментарии

  • Facebook
  • Вконтакте

Похожие статьи