Создание простого горизонтального меню для сайта html

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

Все меню имеют примерно одинаковую html-разметку, будь то горизонтальное или вертикальное меню. Поэтому я буду использовать для обоих типов меню одну и туже разметку. Она выглядит примерно так:

посмотреть результат

Сделаем горизонтальное меню. Для того чтобы ссылки в меню обрели красивую форму, добавим код стиля CSS:

Между тегами (…) вставим наш css-файл со стилями.

посмотреть результат

Код в сборе имеет такой вид:

Также, для украшения меню, в качестве фона можно использовать картинку.
В начале с помощью программы Photoshop  создадим две картинки. Они будут выглядеть примерно так:

Вы можете, приложив фантазию, сделать свои картинки.
Далее, в файле стилей поменяем background для элементов set a и set a:hover. Вот, что у нас получится:

посмотреть результат

Данный вид меню отображается во всех браузерах (Mozilla, Opera, IE).