Раскрась свой мир! Качай кисти, шрифты и много полезностей

Красивая навигация для сайта [от SigTutorials]

Уроки » Дизайн

DrozdOff

27 марта 2008

Напечатать

Красивая навигация для сайта [от SigTutorials]

Этот простой в выполнении урок научит Вас создавать красивую и элегантную панелб навигации для Вашего Web-сайта.


Шаг 1.
Создайте новый файл с параметрами, как на рисунке:
Красивая навигация для сайта [от SigTutorials]


Шаг 2.
Залейте фон вертикальным градиентом. Цвета такие: от #10365a к #2070bf. Получится фон в синих тонах.
Красивая навигация для сайта [от SigTutorials]


Шаг 3.
В правой части изображения с помощью Rectangle Tool нарисуйте белый прямоугольник.
Красивая навигация для сайта [от SigTutorials]


Шаг 4.
Смените режим смешивания для этого слоя на Soft Light и параметр Fill смените до 25%.
Красивая навигация для сайта [от SigTutorials]


Шаг 5.
Создайте новый слой и выделите инструментом Line Tool полоску в один пиксель. После этого залейте полоску градиентом тех же цветов, только в обратном направлении. Это будет служить разделителем для ссылок. Смените режим смешивания этого слоя на Soft Light.
Красивая навигация для сайта [от SigTutorials]


Шаг 6.
Скопируйте слой с разделителем и разместите на картинке столько раз, сколько Вам потребуется.
Красивая навигация для сайта [от SigTutorials]


Шаг 7.
Теперь, с помощью Rectangle Tool сделайте нечто подобное:
Красивая навигация для сайта [от SigTutorials]


Шаг 8.
Создайте, опять же таки с помощью Rectangle Tool, прямоуголное выделение внизу шапке и залейте подходящим цветом. (автор выбрал #03346c)
Красивая навигация для сайта [от SigTutorials]


Шаг 9.
Создайте новый слой и выберите инструмент Pencil. В качестве цвета выберите светлый подходящий к другим цвет (автор выбрал #7dbfff). Нарисуйте линию высотой в один пиксель поверх только что созданного прямоугольника.
Красивая навигация для сайта [от SigTutorials]


Шаг 10.
Скопируйте этот слой и переместите копию наверх, прямо сверху цветных прямоугольничков.
Красивая навигация для сайта [от SigTutorials]


Шаг 11.
Напишите какой-либо текст слева.
Красивая навигация для сайта [от SigTutorials]


Шаг 12.
Настало время подписать каждую из наших кнопочек:
Красивая навигация для сайта [от SigTutorials]


Шаг 13.
Для пущей красоты можно добавить иконок:
Красивая навигация для сайта [от SigTutorials]


Готово!


Источник: SigTutorials
Alexey Koresh DrozdOff,
Специально для www.ColorWorld.org victory



Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь. Мы рекомендуем Вам зарегистрироваться либо зайти на сайт под своим именем.
 (голосов: 2)

Просмотрено: 757 раз

Добавил: Bestduck | ICQ: -- (25 октября 2008 22:28) | #1


Публикаций: 0
Комментариев: 1

Рейтинг:  0 (0) 0 

Спасибо)



Добавил: petrelyudmila | ICQ: -- (13 ноября 2008 12:31) | #2


Публикаций: 0
Комментариев: 1

Рейтинг:  0 (0) 0 

ЖЕСТЬ!



Информация

Посетители, находящиеся в группе Гости, не могут оставлять комментарии в данной новости.


Поиск по сайту

Популярное

Кто на сайте?

Сейчас на сайте:
Пользователей: 2
darkwolf10 GrayToColor

Роботов: 0
Отсутствуют.

Гостей: 9
Всех: 11

30-ка последних посетивших:
_chaos_ AGP
apero CMEPT-27
D46 DrozdOff
FlexZERO funmoody
guria hmelov
hso21 igrulki
iposternam1 jachur
jonext lenochka795
marowo Mexx
Muzfuerer nbox04
Nusferato piliguzova
razr Scar
slepnoga ve2qbazil
vitamin yangoyad
АнтоХА ЛизкО

Друзья сайта

www.FlexZERO.ru

Наш код:

Откуда пришли?

Публикации друзей

01Навигация

02Архив публикаций

03Опрос на сайте

Что из файлов интересует больше?

Шрифты
Кисти
Градиенты
Плагины и дополнения
Стили
Только уроки


04Календарь

«    Ноябрь 2008    »
ПнВтСрЧтПтСбВс
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

05Рекламный блок