WebElement - Лучшие авторские скрипты для вашего сайта и блога
WebElement - это сборник дизайнерских мелочей
А также скриптов, помогающих вам в сайто-строении.
Мы поможем вам сделать сайт красивее, мобильнее и удобнее.
У нас вы можете найти готовые решения на:
HTML, CSS\CSS3, jQuery, JS, плагинам к библиотеке JQ и не только...
Используйте только качественные скрипты на своих сайтах.
Главная » Скрипты »

Изменение всех кнопок на uCoz (темный стиль)

01.08.2012 18:35

DEMOИзменение всех кнопок на uCoz (темный стиль)

Но на всякий случай я добавил демо-пример
И так, приступим к установке...
Code

input[type="submit"] {
  border: 1px solid #444!important;
  border-radius: 3px!important;
  -webkit-box-shadow: 0 0px 1px #000!important;
  -moz-box-shadow: 0 0px 1px #000!important;
  box-shadow: 0 0px 1px #000!important;
  font: bold 11px Sans-Serif!important;
  padding: 3px 6px!important;
  white-space: nowrap!important;
  vertical-align: middle!important;
  color: #999!important;
  background: transparent!important;
  cursor: pointer!important;
}
input[type="submit"]:hover , input[type="submit"]:focus {
  border-color: #444!important;
  background: -webkit-linear-gradient(top, #222, #444)!important;
  background: -moz-linear-gradient(top, #222, #444)!important;
  background: -ms-linear-gradient(top, #222, #444)!important;
  background: -o-linear-gradient(top, #222, #444)!important;
  -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff!important;
  -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff!important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff!important;
}
input[type="submit"]:active {
  border: 1px solid #AAA!important;
  border-bottom-color: #CCC!important;
  border-top-color: #999!important;
  -webkit-box-shadow: inset 0 0px 2px #aaa!important;
  -moz-box-shadow: inset 0 0px 2px #aaa!important;
  box-shadow: inset 0 0px 2px #aaa!important;
  background: -webkit-linear-gradient(top, #333, #666)!important;
  background: -moz-linear-gradient(top, #333, #666)!important;
  background: -ms-linear-gradient(top, #333, #666)!important;
  background: -o-linear-gradient(top, #333, #666)!important;
}
input[type="submit"]:disabled {
  border: 1px solid #444!important;
  border-radius: 3px!important;
  -webkit-box-shadow: 0 0px 1px #444!important;
  -moz-box-shadow: 0 0px 1px #444!important;
  box-shadow: 0 0px 1px #444!important;
  font: bold 11px Sans-Serif!important;
  padding: 3px 6px!important;
  white-space: nowrap!important;
  vertical-align: middle!important;
  color: #666!important;
  background: transparent!important;
}

input[type="button"] {
  border: 1px solid #444!important;
  border-radius: 3px!important;
  -webkit-box-shadow: 0 0px 1px #000!important;
  -moz-box-shadow: 0 0px 1px #000!important;
  box-shadow: 0 0px 1px #000!important;
  font: bold 11px Sans-Serif!important;
  padding: 3px 6px!important;
  white-space: nowrap!important;
  vertical-align: middle!important;
  color: #999!important;
  background: transparent!important;
  cursor: pointer!important;
}
input[type="button"]:hover , input[type="button"]:focus {
  border-color: #444!important;
  background: -webkit-linear-gradient(top, #222, #444)!important;
  background: -moz-linear-gradient(top, #222, #444)!important;
  background: -ms-linear-gradient(top, #222, #444)!important;
  background: -o-linear-gradient(top, #222, #444)!important;
  -webkit-box-shadow: 0 0px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff!important;
  -moz-box-shadow: 0 0px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff!important;
  box-shadow: 0 0px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff!important;
}
input[type="button"]:active {
  border: 1px solid #AAA!important;
  border-bottom-color: #CCC!important;
  border-top-color: #999!important;
  -webkit-box-shadow: inset 0 0px 2px #aaa!important;
  -moz-box-shadow: inset 0 0px 2px #aaa!important;
  box-shadow: inset 0 0px 2px #aaa!important;
  background: -webkit-linear-gradient(top, #333, #666)!important;
  background: -moz-linear-gradient(top, #333, #666)!important;
  background: -ms-linear-gradient(top, #333, #666)!important;
  background: -o-linear-gradient(top, #333, #666)!important;
}
input[type="button"]:disabled {
  border: 1px solid #444!important;
  border-radius: 3px!important;
  -webkit-box-shadow: 0 0px 1px #444!important;
  -moz-box-shadow: 0 0px 1px #444!important;
  box-shadow: 0 0px 1px #444!important;
  font: bold 11px Sans-Serif!important;
  padding: 3px 6px!important;
  white-space: nowrap!important;
  vertical-align: middle!important;
  color: #666!important;
  background: transparent!important;
}
input[type="file"] {
  border: 1px solid #444!important;
  border-radius: 3px!important;
  -webkit-box-shadow: 0 0px 1px #000!important;
  -moz-box-shadow: 0 0px 1px #000!important;
  box-shadow: 0 0px 1px #000!important;
  font: bold 11px Sans-Serif!important;
  padding: 3px 6px!important;
  white-space: nowrap!important;
  vertical-align: middle!important;
  color: #999!important;
  background: transparent!important;
  cursor: pointer!important;
}
input[type="file"]:hover , input[type="file"]:focus {
  border-color: #444!important;
  background: -webkit-linear-gradient(top, #222, #444)!important;
  background: -moz-linear-gradient(top, #222, #444)!important;
  background: -ms-linear-gradient(top, #222, #444)!important;
  background: -o-linear-gradient(top, #222, #444)!important;
  -webkit-box-shadow: 0 0px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff!important;
  -moz-box-shadow: 0 0px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff!important;
  box-shadow: 0 0px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff!important;
}
input[type="file"]:active {
  border: 1px solid #AAA!important;
  border-bottom-color: #CCC!important;
  border-top-color: #999!important;
  -webkit-box-shadow: inset 0 0px 2px #aaa!important;
  -moz-box-shadow: inset 0 0px 2px #aaa!important;
  box-shadow: inset 0 0px 2px #aaa!important;
  background: -webkit-linear-gradient(top, #333, #666)!important;
  background: -moz-linear-gradient(top, #333, #666)!important;
  background: -ms-linear-gradient(top, #333, #666)!important;
  background: -o-linear-gradient(top, #333, #666)!important;
}
input[type="file"]:disabled {
  border: 1px solid #444!important;
  border-radius: 3px!important;
  -webkit-box-shadow: 0 0px 1px #444!important;
  -moz-box-shadow: 0 0px 1px #444!important;
  box-shadow: 0 0px 1px #444!important;
  font: bold 11px Sans-Serif!important;
  padding: 3px 6px!important;
  white-space: nowrap!important;
  vertical-align: middle!important;
  color: #666!important;
  background: transparent!important;
}

Данный код можно подключить отдельным файлом, а можно просто добавить в ваш CSS в панели управления.
Категория: Оформление кнопок | Просмотров: 804 | Добавил: Cradleshel

Теги: кнопки, кнопки для ucoz, кнопки для сайта, CSS3, кнопки CSS, Buttons
Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
Регистрация | Вход
«  Август 2012  »
ПнВтСрЧтПтСбВс
  12345
6789101112
13141516171819
20212223242526
2728293031
Нужен ли новый дизайн?
Результат
Всего ответов: 117

Полезная информация

Мы настоятельно рекомендуем вам использовать браузеры последних версий. Нажмите на иконку, чтобы перейти к скачиванию нужного вам браузера

Для правильного отображения сайта, вам понадобится минимальное разрешение экрана 1024 x 768px, оптимальное разрешение: 1280 x 1024px

Копирование материалов с данного сайта разрешено только с указанием обратной ссылки на источник


Copyright WebElement © 2012 - 2024
Лучшие авторские скрипты для вашего сайта и блога.

Перейти к тегам сайта
Используются технологии uCoz
Яндекс.Метрика

Статистика

Всего: 1
Гостей: 1
Юзеров: 0