CSS Tab Designer - программа генерирующая меню для сайта - 4.5 out of 5 based on 2 votes

Программа для создания меню сайтаCSS Tab Designer является хорошей программой для создания меню сайта. Это генератор горизонтальных и вертикальных CSS меню.

Для работы в программе не требуются знания CSS, весь процесс создания меню происходит при помощи визуального редактора.

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

Материалы по теме:

Нажмите на кнопку "Демо" чтобы просмотреть некоторые варианты меню которые можно создать в программе.

Функции программы CSS Tab Designer

#1. Редактирование меню при помощи визуального редактора с одновременным просмотром результата.

#2. Содержит очень красивые вертикальные и горизонтальные шаблоны меню.

#3. Для работы программы не требуется установки дополнительных компонентов, достаточно просто установить программу.

#4. Меню, генерируемое программой, создается только с использованием CSS и HTML.

#5. Код, генерируемый программой, является кроссбраузерным (совместимым для разных браузеров)

#6. Полностью бесплатная программа.

Интерфейс программы

CSS Tab Designer

В качестве примера рассмотрим создание меню в программе.

Для начала в окошке Tab Styles необходимо выбрать тот шаблон который вы желаете использовать в качестве меню и кликнуть по ссылке "Fill with samples" которая находится с лева в окне "Tasks".

1

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

2

В результате загрузится окно в котором вы можете задать название и ссылку для данного пункта меню.

3

Таким же образом все проделываем и для остальных пунктов меню. Если у вас лишний пункт меню, то выделите его и нажмите на иконку удаления 4. Если нужно добавить пункт то кликните по иконке с крестиком 5, а затем введя название и ссылку создайте новый пункт меню. При помощи стрелочек 6 вы можете перемещать пункты меню относительно друг друга.

Когда вы будете вводить русские символы в качестве названий пунктов меню то в окне просмотра вместо введенных символов будет кракозябра. Не расстраивайтесь просто все дело в кодировке, которая указанна для данной страницы. Когда вы перенесете меню на свою страницу с правильной кодировкой, то все будет отображаться правильно.

Для того чтобы сохранить меню, выберите пункт "File" >> "Generate HTML & Images", дайте имя и сохраните HTML файл, с изображением использующимся для создания меню, в папку на вашем компьютере.

7

Код для интеграции данного меню на страницы своего сайта можно взять из сохраненного HTML файла, открыв его при помощи какого либо редактора или перейдя в низу окна программы по вкладке "Code".

Сам CSS код при помощи которого оформлено меню находится между тегами <style> </style>, а HTML код который создает структуру меню между тегами <body> и </body>.

Для интеграции меню на страницы своего сайта скопируйте CSS код и добавьте его в файл стилей своего сайта, а также скопируйте HTML код и добавьте на страницы сайта.

Файлы для скачивания

Материал подготовлен порталом: WebMasterMix.ru

 

Обсуждение материала

Войдите или зарегистрируйтесь,
чтобы добавить вопросы, идеи или ошибки, по данному материалу!

1 1 1 1 1 1 1 1 1 1 Рейтинг 4.75 (2 Голосов)