Рубрика CSS

Свежий набор меню основанных на CSS

Набор представляет собой CSS меню для вашего сайта, в котором не используются изображения и JavaScript. Разметка для всех меню одинаковая, я лишь использовал 12 различных стилей для их оформления.

Основная идея состоит в том, чтобы иметь большую ссылку для заголовка и некоторое описание под ней. Описание может быть скрыто с помощью visibility:hidden а затем показано, при наведении указателя мыши. Заголовок и описание находятся между тегами <span> и могут быть стилизованы как угодно.

Разметка выглядит следующим образом:

<div id="menu1">
<ul>
<li><a href="">
<span>About</span>
<span>Who we are</span>
</a>
</li>
<li><a href="">
<span>Portfolio</span>
<span>What we do</span>
</a>
</li>
<li><a href="">
<span>Blog</span>
<span>What we talk about</span>
</a>
</li>
<li><a href="">
<span>Contact</span>
<span>How to get in touch</span>
</a>
</li>
</ul>
</div>

Наслаждайтесь!

Источник: www.tympanus.net.
Перевод: Администратор сайта explorer-soft.com.