Главная / Блог / Обзоры / CSS-меню как элемент навигации

CSS-меню как элемент навигации

19 августа 13
Reading Time: 1
Комментариев нет
1 Star2 Stars3 Stars4 Stars5 Stars (3 votes)

Каскадные таблицы стилей широко используются в веб-дизайне, так как с их помощью, особенно в связке с HTML 5, можно реализовать множество действительно удобных и полезных вещей. В этом плане особенно полезно поискать примеры того, что можно сделать с помощью CSS, на различных англоязычных сайтах, поскольку приемы, взятые из таких уроков, позволят сделать сайт действительно современным, стильным и динамичным.

Одним из примеров эффективного использования каскадных таблиц стилей является создание с их помощью CSS меню. Если требуется что-то относительно простое, можно пробовать сделать все самостоятельно, а при необходимости в более сложных решениях – скачать готовый код, примеров которого можно найти довольно много на различных сайтах. Что интересно, существуют специальные сервисы, которые позволяют автоматизировать создание СSS меню, путем его генерации в требуемом вам виде, для чего достаточно ввести требуемые параметры.

Чаще всего на сайтах используется горизонтальное меню на CSS, что довольно удобно в плане интеграции навигации в общую концепцию дизайна. Вот, например, как это выглядит многоуровневое выпадающее меню на практике (демо сервиса): 
 

Также, можно использовать и Java Script, чтобы добавить элементам интерактивности.

Учитывая тот факт, что объем кода для реализации подобных вещей будет немалым, мы не будем приводить его фрагменты, так как по соответствующим запросам все необходимое в готовом виде бесплатно можно найти в поисковых системах. Вместо этого, приведем несколько примеров сервисов, с помощью которых можно сгенерировать красивое вертикальное или горизонтальное выпадающее меню на CSS буквально с помощью нескольких кликов.

CSS Menu Maker (cssmenumaker.com) – онлайн генератор, который позволяет сгенерировать меню на CSS, которое действительно красиво выглядит и совместимо со всеми популярными браузерами: 
 

Также здесь предлагается платное ($29) расширение для популярного редактора Dreamveawer, которое обладает аналогичными функциями, и может стать действительно полезным инструментом для вебмастера.

CSS Menu Builder (cssmenubuilder.com) – пользователю предлагается более тысячи комбинаций как в горизонтальном, так и вертикальном виде, не говоря уж о возможных цветовых решениях. Получается, правда, не так красиво как в первом упоминаемом сервисе, но тоже довольно интересно.

Pure CSS Menu.com (purecssmenu.com) – онлайновый генератор с подробной справкой для пользователя: как это работает, принципы генерации, кастомизация, работа с различными браузерами и т.д.

Скачать ImageCMS совершенно бесплатно

Также, рекомендуем обратить внимание на сайт css3menu.com, с помощью которого также можно создать красивые меню самого разного вида. Перед тем как сгенерировать код, его можно протестировать в демо-режиме на самом сайте.

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

Comments (0)

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

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Создайте свой личный демо-магазин ImageCMS
Подпишитесь, чтобы получать новости

Be the first to know about Premmerce development and project news

Вы успешно подписались на наши новости. Спасибо большое!