Горизонтальное меню с градиентом цвета

Информация, представленная на этой странице ориентирована в первую очередь для начинающих web-мастеров.

Это простое, но профессионально выглядящее меню на CSS с использованием изображений. Границы между пунктами меню разделены белой линией. Стиль меню очень легко настроить в CSS.

Установка на сайт

1. Код в таблице внизу вставить в раздел head или файл стилей сайта:

2. А этот код скопируйте и расположите в разделе body в том месте, где желаете видеть меню:

<ul class="solidblockmenu">
<li><a href="#" class="current">Главная</a></li>
<li><a href="#">CSS примеры</a></li>
<li><a href="#">Программы</a></li>
<li><a href="#">Дизайн</a></li>
<li><a href="#">Скрипты</a></li>
<li><a href="#">Галерея</a></li>
</ul>

В демо-примере первой ссылке присвоен класс current, поэтому эта ссылка (Главная) уже находится под воздействием параметров свойства .current. Если не желаете использовать такой вариант, просто удалите из первой ссылки часть кода class="current" и в CSS удалите свойство .current из строки:

.solidblockmenu li a:hover, .solidblockmenu li .current

Используемые изображения:

Сохраните эти изображения в папку img, которая должна находиться в одной директории с файлом, в котором расположено меню.

Впишите свои URL-лы и названия ссылок.

Спасибо за внимание. Посещайте мой сайт. Пока! L.M.