Понедельник, 23.09.2024, 15:22
Приветствую Вас Гость | RSS

Графика для вебмастера

Каталог статей

Главная » Статьи » Кнопки для сайта

Кнопка "Контакты"

Стильная кнопка "Контакты"

 
 
 
 
Давайте попробуем создать стильную кнопочку "Контакты", которую можно установить в шапке сайта или в футере (подвал сайта). Кнопка будет иметь такой вид:
Делать такую кнопку будем в программе Фотошоп. В программе создаём документ размером 150х150 рх. Потом размер подгоним до необходимого.


 
 
 
Теперь поработаем со стилями слоя и окраской будущей кнопки:

Тень
 
 
 
Наложение градиента. Цвет подбирайте по своей необходимости:
 
 
Обводка:
 
 
В результате у нас получается вот такая заготовка:
 
 
 
Дальше будем рисовать конверт. Для удобства с помощью инструмента "Масштаб" увеличим изображение. Создаём новый слой Для начала выставим основной цвет Белый и инструментом "Прямоугольник" нарисуем форму конверта:
 
 
Открываем окно "Стиль слоя" и выставляем некоторые значения:

Тень:
 
 
Внешнее свечение:
 
 
Обводка:
 
 
Кнопка приняла следующий вид:
 
 
Создайте новый слой, выставьте основной цвет Черный и включите инструмент "Линия"
 
 
 
Установите толщину линии:
 
 
С помощью инструмента "Линия" нарисуйте образ конверта:
 
 
 
И осталось сделать надпись на кнопке "Контакты", используя инструмент "Горизонтальный текст":
 
 
Можно текст немного украсить, поработав в окне "Стиль слоя":

Внутренняя тень:
 
 
Наложение градиента:
 
 
Обводка:
 
 
В результате текст немного преобразится:
 
 
 
На теле страницы кнопка будет выглядеть так:
 
 
Теперь остаётся изменить размер кнопки до нужного. Для этого пройдите в меню "Изображение"==>"Размер изображения" и выставить нужные размеры кнопки или можно воспользоваться способом трансформирования - клавиши CTRL + T. Кнопку можно вставить в шапку сайта, в футер или на любых страницах как кликабельную картинку. Кто не знает, что такое кликабельная картинка, можете прочитать статью "Как сделать картинку кликабельной"
Категория: Кнопки для сайта | Добавил: zuma307 (24.07.2015)
Просмотров: 485 | Рейтинг: 0.0/0
Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Меню сайта
Категории раздела
Кнопки для сайта [6]
Вертикальное меню [2]
Горизонтальное меню [2]
Шапка для сайта [2]
Создание баннера [1]
Создание логотипа [2]
Эффекты для текста [2]
Вход на сайт
Продажа сайтов
Магазин сайтов Top-Bit
Статистика

Онлайн всего: 1
Гостей: 1
Пользователей: 0
Copyright MyCorp © 2024
Создать бесплатный сайт с uCoz