Авторизация
Игрык
Свежее
| [19.01.2012] | |
| Realtek High Definition Audio Driver R2.67 (0) | |
| [01.06.2012] | |
| (((NoOb))) (0) | |
| [04.09.2012] | |
| Flash статистика CW встиле огня (0) | |
| [07.09.2012] | |
| Новый вид статистики Ucoz (0) | |
| [07.09.2012] | |
| Скрипт Наши сервера в одном блоке (0) | |
| [12.09.2012] | |
| Новый информер комментарии для ucoz как на Dle (0) | |
| [12.09.2012] | |
| Скрипт друзья сайта для uCoz (0) | |
| [13.09.2012] | |
| Новый вид опроса для uCoz. Выполнен в светлых тонах (0) | |
| [13.09.2012] | |
| Статистика кто посетил в красивом стиле для uCoz (0) | |
| [28.09.2012] | |
| Скрипт радио на сайт (0) | |
Топ файлов
 | 1 Браузер Opera для PSP Дата добавления:27.10.2012 Автор: Ross_Kemp Просмотров: 11551 |
 | 2 Иконки для папок TROLL FA... Дата добавления:13.05.2012 Автор: Smertnik Просмотров: 8347 |
 | 3 Кисть для фотошопа - Рисо... Дата добавления:13.05.2012 Автор: Ross_Kemp Просмотров: 3673 |
 | 4 PSX2PSP v1.4.2 для PSP Дата добавления:27.10.2012 Автор: Ross_Kemp Просмотров: 4043 |
 | 5 Rip pbhack.ru Дата добавления:13.11.2011 Автор: Ross_Kemp Просмотров: 2426 |
Топ Пользователей
Партнеры
Статистика
» Кнопки для uCoz » Кнопки на CSS
Новичкам думаю пригодится. Есть 4 цветовых варианта: Черная, красная, зеленая и синяя кнопка. Так же цвета можно и самому настроить. Работает в Mozilla Firefox, Google Chrome и в Opera.
Итак начнем.
Это вставляем в css:
Надеюсь догадались, что button.black - это черная кнопка,button.red - красная,button.blue - синяя,button.green - зеленая.
Код вызова самих кнопок:
Черная:
Синяя:
Зеленая:
Красная:
Все!
Вот ДЕМО.
Рекомендуем:
Кнопки на CSS
- Автор: Гость
- 18.05.2024
Новичкам думаю пригодится. Есть 4 цветовых варианта: Черная, красная, зеленая и синяя кнопка. Так же цвета можно и самому настроить. Работает в Mozilla Firefox, Google Chrome и в Opera.
Итак начнем.
Это вставляем в css:
Code
.button.black {background: url('http://usite.su/images/new/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://usite.su/images/new/highlight_faint.png')
repeat-x top #404040}
.button.black:active {background: url('http://usite.su/images/new/highlight_faint.png')
repeat-x top #151515}
.button.red {background: url('http://usite.su/images/new/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://usite.su/images/new/highlight_faint.png') repeat-x
top #dd0101}
.button.red:active {background: url('http://usite.su/images/new/highlight_faint.png') repeat-
x top #b60404}
.button.blue {background: url('http://usite.su/images/new/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://usite.su/images/new/highlight_faint.png') repeat-
x top #0278e7}
.button.blue:active {background: url('http://usite.su/images/new/highlight_faint.png')
repeat-x top #005eb6}
.button.green {background: url('http://usite.su/images/new/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://usite.su/images/new/highlight_faint.png')
repeat-x top #74bc15}
.button.green:active {background: url('http://usite.su/images/new/highlight_faint.png')
repeat-x top #62a011}
.button.black:hover {background: url('http://usite.su/images/new/highlight_faint.png')
repeat-x top #404040}
.button.black:active {background: url('http://usite.su/images/new/highlight_faint.png')
repeat-x top #151515}
.button.red {background: url('http://usite.su/images/new/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://usite.su/images/new/highlight_faint.png') repeat-x
top #dd0101}
.button.red:active {background: url('http://usite.su/images/new/highlight_faint.png') repeat-
x top #b60404}
.button.blue {background: url('http://usite.su/images/new/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://usite.su/images/new/highlight_faint.png') repeat-
x top #0278e7}
.button.blue:active {background: url('http://usite.su/images/new/highlight_faint.png')
repeat-x top #005eb6}
.button.green {background: url('http://usite.su/images/new/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://usite.su/images/new/highlight_faint.png')
repeat-x top #74bc15}
.button.green:active {background: url('http://usite.su/images/new/highlight_faint.png')
repeat-x top #62a011}
Надеюсь догадались, что button.black - это черная кнопка,button.red - красная,button.blue - синяя,button.green - зеленая.
Код вызова самих кнопок:
Черная:
Code
<a href=''><div class='button black'>Я черная кнопка</div></a>
Синяя:
Code
<a href=''><div class='button blue'>Я синяя кнопка</div></a>
Зеленая:
Code
<a href=''><div class='button green'>Я зеленая кнопка</div></a>
Красная:
Code
<a href=''><div class='button red'>Я красная кнопка</div></a>
Все!
Вот ДЕМО.
- Просмотров: 720
- Загрузок: 0
Рекомендуем:
| Комментарии | |
| Нет комментариев | |
