Войти на сайт Регистрация
Добавить файлВ каталоге: 678
Разноцветные кнопки на CSS для uCoz
13.11.2018
Разноцветные кнопки на CSS для uCoz
  • 551 Просмотров:
  • 0 Скачиваний:
  • 0 Комментариев:
  • 0.0 Рейтинг:
  • (Голосов: 0)
Описание:
Красивые разноцветные кнопки сделаны при помощи CSS. Подойдут для разных сайтов т.к выполнены они в 4 цветах.

Посмотреть Демо

Установка:

В Таблицу стилей CSS:

Код
.button.black {background: url('http://7old.ru/ucoz-files/highlight_faint.png') repeat-x top #272727; display: inline-block;border: 1px solid #161616;border-radius: 3px;color: #fff;padding: 5px;margin-bottom: 3px}  
  .button.black:hover {background: url('http://7old.ru/ucoz-files/highlight_faint.png') repeat-x top #404040}  
  .button.black:active {background: url('http://7old.ru/ucoz-files/highlight_faint.png') repeat-x top #151515}  

  .button.red {background: url('http://7old.ru/ucoz-files/highlight_faint.png') repeat-x top #cd0000;display: inline-block;border: 1px solid #8a0000;border-radius: 3px;color: #fff;padding: 5px;margin-bottom: 3px}  
  .button.red:hover {background: url('http://7old.ru/ucoz-files/highlight_faint.png') repeat-x top #dd0101}  
  .button.red:active {background: url('http://7old.ru/ucoz-files/highlight_faint.png') repeat-x top #b60404}  

  .button.blue {background: url('http://7old.ru/ucoz-files/highlight_faint.png') repeat-x top #0173dd;display: inline-block;border: 1px solid #294c8b;border-radius: 3px;color: #fff;padding: 5px;margin-bottom: 3px}  
  .button.blue:hover {background: url('http://7old.ru/ucoz-files/highlight_faint.png') repeat-x top #0278e7}  
  .button.blue:active {background: url('http://7old.ru/ucoz-files/highlight_faint.png') repeat-x top #005eb6}  

  .button.green {background: url('http://7old.ru/ucoz-files/highlight_faint.png') repeat-x top #6db114;display: inline-block;border: 1px solid #5a7f2a;border-radius: 3px;color: #fff;padding: 5px;margin-bottom: 3px}  
  .button.green:hover {background: url('http://7old.ru/ucoz-files/highlight_faint.png') repeat-x top #74bc15}  
  .button.green:active {background: url('http://7old.ru/ucoz-files/highlight_faint.png') repeat-x top #62a011}


Код вызова самих кнопок:

Черная:

Код
<a href=''><div class='button black'>Я черная кнопка</div></a>


Синяя:

Код
<a href=''><div class='button blue'>Я синяя кнопка</div></a>


Зеленая:

Код
<a href=''><div class='button green'>Я зеленая кнопка</div></a>


Красная:

Код
<a href=''><div class='button red'>Я красная кнопка</div></a>


Готово.
Разноцветные кнопки на CSS для uCoz" title="Скачать Разноцветные кнопки на CSS для uCoz бесплатно, без смс и регистрации" target="_blank">Сервер Скачать файл
Источник: kiruxaable
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]