Автор: 
В этом уроке будем создавать красивый поиск для сайтов на ucoz. Сейчас сделаем поиск который будет смотреться одинаково во всех браузерах, лично я на это надеюсь, так как проверял в опере, лисе, хроме и ie, но думаю в остальных будет смотреться также.
1)Для начала я создал картинку которая будет фоном поиска (293х60/01.gif)
2)Далее нашел небольшой значок с лупой и сделал спрайт (68х120/1.png)
3)Сам поиск
<div style="position:relative;">
<input type="text" name="query" id="forma" value="search..." onfocus="if(this.value=='search...')this.value=''" onblur="if(this.value=='')this.value='search...'"/>
<input class="knp" name="sfSbm" type="submit" value="" />
<input name="a" value="14" type="hidden">
</div>
</form>
Я добавил див с position:relative для того чтобы выровнять кнопку с лупой при помощи position:absolute.
4)В css
background:url(images/01.gif) no-repeat;
width:293px; /* ширина */
height:60px; /* Высота */
padding-top:17px; /* смещаем всё что внутри в низ, чтобы было ровно */
}
#forma {
background:none; /* убираем белый фон */
font-size:18px; /* размер шрифта */
font-family:Verdana; /* Шрифт */
color:#bba78b; /* цвет шрифта */
margin-left:20px; /* смещаем в право слово search */
border:none; /* убираем обводку */
}
.knp {
background:url(images/1.png) no-repeat;
width:60px;
height:60px;
border:none; /* убираем обводку */
position:absolute; /* для того чтобы можно было сместить вверх */
top:-16px; /* Смещаем вверх кнопку с лупой */
}
.knp:hover {
background:url(images/1.png) 0px -60px no-repeat;
cursor:pointer; /* курсор в виде руки */
}
Теперь мы имеем симпотичный поиск, который можно изменить под ваш
дизайн. Конечно я как сапожник без сапог, поэтому в пример поиска не
берём этот сайт, так как тут он не крособраузерен, а сделать нормальный
ещё долго руки не дойдут. Кстате здесь показан поиск для модуля
"новости".
Комментарии от меня: для того, что бы сделать поиск не только по нвоостям, а по всем материалам и категориям нужно:
<form action="http://7ucoz.com/news/" id="poisk" method="post">
заменить на
