Для сайта - Уроки Adobe Photoshop - Каталог статей - Лучшие фильмы.Смотреть онлайн.Шаблоны,скрипты для ucoz.
Меню сайта
Категории каталога
Материалы сайта

Облако тегов
STALKER-ZONA (шаблон для uCoz) Невеста с того света / Over Her Dead Body Скачать фильм Крикуны 2: Охота / Screamers 2: The Hunting (2009) DVDRip Смотреть онлайн Прожектор Пэрис Хилтон (выпуск 21) Смотреть сериал Клиника / SCRUBS (Сезон 4) онлайн Смотреть сериал Клиника / SCRUBS (Сезон 1) онлайн Скачать бесплатно шаблон на тему кс от GoLD_THeMe by ToM@TiK Кс шаблон для uCoz Текст-сплав Скачать набор кнопок для ucoz « Почтовый конверт в PhotoShop » Шаблон на тему CS black by AleX Шаблон для сайта на тему Counter Strike Смотреть онлайн Пила 4 / Saw IV Смотреть онлайн Голый барабанщик / The Rocker Смотреть онлайн Прожектор Пэрис Хилтон (выпуск 29) Шаблон для UCOZ Rip By EVILAMN Операция Валькирия / Valkyrie (2008) Замерзшее окно в PHOTOSHOP Смотреть онлайн Школа серфинга / Surf School Отличный шаблон для кланов, сайтов СS, Скачать фильм Рикер 2 / No Man's Land: The Rise of Reeker (2008) DVDRip Игровой шаблон на тему Mirror Edge Звездная пыль / Stardust (2007) Шаблон на тему автомобили
Главная » Статьи » Уроки Adobe Photoshop » Для сайта

Глянцевая навигационная панель для сайта

Глянцевая навигационная панель



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



Шаг 1

Сначала откройте новый документ любого размера, которого захотите (зависит от того, насколько большим будет ваш сайт и залейте его цветом #1A1A1A.

Затем выделите область, в которой будет находиться ваша панель.

glossy_navigation_bar1.gif

Шаг 2

Теперь залейте её любым цветом и затем зайдите в Blending Options и поставьте следующие настройки:

glossy_navigation_bar2_1.gif

У вас должно выйти что-то подобное:

glossy_navigation_bar2_2.gif

Шаг 3

Но мне всё ещё не нравится, как оно выглядит, так что следующим нашим шагом будет добавление
Inner Glow:

glossy_navigation_bar3.gif

Шаг 4

Уже получше. Теперь выделите область немного меньше половины вашей навигационной панели и залейте её #FFFFFF. Поставьте Opacity на 40% и blending status слоя на Overlay.

glossy_navigation_bar4.gif

Шаг 5

Теперь мы создадим кнопку. Выделите небольшую область и залейте её любым цветом, каким захотите. Расположите этот слой под белым слоем. Примените следующие настройки к слою вашей кнопки:

glossy_navigation_bar5_1.gif

glossy_navigation_bar5_2.gif

glossy_navigation_bar5_3.gif

У вас должно получиться что-то подобное этому:

glossy_navigation_bar5_4.gif

Шаг 6

Теперь давайте добавим текст. Наберите что-нибудь на черной стороне вашей панели шрифтом Arial-Regular-15 pt-Strong и поставьте следующие настройки:

glossy_navigation_bar6_1.gif

Ваш текст должен выглядеть так:

glossy_navigation_bar6_2.gif

Вы можете добавить ещё кнопки:

glossy_navigation_bar6_3.gifglossy_navigation_bar6_3.gif

Шаг 7

Теперь давайте добавим текст зеленой кнопке. Используйте тот же шрифт и стиль шрифта, измените лишь опции. Поставьте такие:

glossy_navigation_bar7.gif

Если вы делали то же, что и я, вот что у вас должно было получиться:

Глянцевая навигационная панель

Категория: Для сайта | Добавил: cinemania (28.12.2008)
Просмотров: 240 | Рейтинг: 0.0/0 | |Теги:
Пожалуйста! Если вам понравился этот материал нажмите кнопку "СПАСИБО" или напишите свой отзыв. Посетите наш ФОРУМ



Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Форма Входа
Воскресенье, 14.03.2010, 20:48
-й день

Гость, мы рады вас видеть. Пожалуйста зарегистрируйтесь или авторизуйтесь!
 
E-mail:
Пароль:
Друзья сайта
Материалы сайта
Статистика
Internet Map Рейтинг сайтов Русский Топ Поддержите наш сайт в каталоге Infan.ru Рейтинг Сайтов YandeG
Онлайн всего: 6
Гостей: 6
Пользователей: 0

Лучшие фильмы | Уроки Adobe Photoshop. | Шаблоны для uCoz | Онлайн-TV | Тест скорости интернет | Полезные сервисы | Скрипты для uCoz