Есть такая проблемка!

[uerter]

Есть такая проблемка: как сделать поле для ввода текста когда она не активна у нее определенный цвет, а когда нажимаеш на нее то она свой цвет меняет.
Если я как-то не понятноо выражаюсь, то вы можете посмотреть что я имел в виду, смотрим http://www.nnm.org.ua, там есть поле для ввода определенного текска (поиск и правой стороны).
Как делать имено поле чтобы оно меняло свой цвет?

[EvroStandart]

Открываем код страницы и смотрим.
Поле для поиска прописано так: <input type=text name=story size=18 class=name onfocus="id=className" onblur="id=''"">

Стили в отдельном файле styles.css:

A:link {FONT-WEIGHT: bold; FONT-SIZE: 11px; COLOR: #00557d; FONT-FAMILY: Tahoma; TEXT-DECORATION: none}
A:visited {FONT-WEIGHT: bold; FONT-SIZE: 11px; COLOR: #00557d; FONT-FAMILY: Tahoma; TEXT-DECORATION: none}
A:hover {FONT-WEIGHT: bold; FONT-SIZE: 11px; COLOR: #00557d; FONT-FAMILY: Tahoma; TEXT-DECORATION: underline}
.center {BORDER-RIGHT: medium none; PADDING-RIGHT: 10px; BORDER-TOP: medium none; PADDING-LEFT: 5px; FONT-SIZE: 11px; PADDING-BOTTOM: 10px; BORDER-LEFT: medium none; COLOR: #5c5c5c; PADDING-TOP: 1px; BORDER-BOTTOM: medium none; FONT-FAMILY: Tahoma; TEXT-DECORATION: none}
.righttable {BORDER-RIGHT: medium none; PADDING-RIGHT: 10px; BORDER-TOP: medium none; PADDING-LEFT: 13px; FONT-SIZE: 11px; PADDING-BOTTOM: 10px; BORDER-LEFT: medium none; COLOR: #5c5c5c; PADDING-TOP: 1px; BORDER-BOTTOM: medium none; FONT-FAMILY: Tahoma; TEXT-DECORATION: none}
.lefttable {BORDER-RIGHT: medium none; PADDING-RIGHT: 10px; BORDER-TOP: medium none; PADDING-LEFT: 5px; FONT-SIZE: 11px; PADDING-BOTTOM: 10px; BORDER-LEFT: medium none; PADDING-TOP: 1px; BORDER-BOTTOM: medium none; FONT-FAMILY: Tahoma; TEXT-DECORATION: none}
.newstitle {BORDER-RIGHT: medium none; PADDING-RIGHT: 10px; BORDER-TOP: medium none; PADDING-LEFT: 5px; FONT-WEIGHT: bold; FONT-SIZE: 11px; PADDING-BOTTOM: 10px; BORDER-LEFT: medium none; COLOR: #4f4f4f; PADDING-TOP: 10px; BORDER-BOTTOM: medium none; FONT-FAMILY: Tahoma; TEXT-ALIGN: center; TEXT-DECORATION: none}
.news {BORDER-RIGHT: medium none; PADDING-RIGHT: 10px; BORDER-TOP: medium none; PADDING-LEFT: 5px; FONT-WEIGHT: bold; FONT-SIZE: 11px; PADDING-BOTTOM: 10px; BORDER-LEFT: medium none; COLOR: #4f4f4f; PADDING-TOP: 20px; BORDER-BOTTOM: medium none; FONT-FAMILY: Tahoma; TEXT-ALIGN: center; TEXT-DECORATION: none}
.newsbody {BORDER-RIGHT: medium none; PADDING-RIGHT: 22px; BORDER-TOP: medium none; PADDING-LEFT: 22px; FONT-SIZE: 11px; PADDING-BOTTOM: 5px; BORDER-LEFT: medium none; COLOR: #4f4f4f; PADDING-TOP: 0px; BORDER-BOTTOM: medium none; FONT-FAMILY: Verdana; TEXT-ALIGN: justify; TEXT-DECORATION: none}
.link {BORDER-RIGHT: medium none; PADDING-RIGHT: 2px; BORDER-TOP: medium none; PADDING-LEFT: 2px; FONT-SIZE: 11px; PADDING-BOTTOM: 5px; BORDER-LEFT: medium none; COLOR: #00557D; PADDING-TOP: 0px; BORDER-BOTTOM: medium none; FONT-FAMILY: Verdana; TEXT-ALIGN: center; TEXT-DECORATION: none}
div {FONT-SIZE: 11px; COLOR: #4f4f4f; FONT-FAMILY: Verdana;}
body {FONT-SIZE: 11px; COLOR: #4f4f4f; FONT-FAMILY: Verdana; TEXT-ALIGN: justify; TEXT-DECORATION: none}
table {FONT-SIZE: 11px; COLOR: #4f4f4f; FONT-FAMILY: Verdana; TEXT-ALIGN: justify; TEXT-DECORATION: none}
.name	{border: 1px; border-style: solid; border-color: #000000; background-color: #CADBEB; font-family: verdana; font-size: 12px; color: #000000;}
#name	{border: 1px; border-style: solid; border-color: #000000; background-color: #ffffff; font-family: verdana; font-size: 12px; color: #000000;}
.submit	{border: 0px; background-color: #CADBEB; font-family: verdana; font-size: 13px; color: #000000;}
table.tb1	{height:59; cellSpacing:0; cellPadding:0; width:100%; background-image: url('/images/main.jpg');}
table.tb2	{cellSpacing:0; cellPadding:0; width:100%;}
table.tb3	{cellSpacing:0; cellPadding:0; width:187;}
table.tb4	{height:35; width:187;}
IMG.button	{FILTER: alpha(Opacity=65)}

Для поля поиска должны быть две строчки:
.name {border: 1px; border-style: solid; border-color: #000000; background-color: #CADBEB; font-family: verdana; font-size: 12px; color: #000000;}
#name {border: 1px; border-style: solid; border-color: #000000; background-color: #ffffff; font-family: verdana; font-size: 12px; color: #000000;}

[dacuan]

Делаешь так:
1) Открываешь http://www.nnm.org.ua;
2) Сохраняешь страницу себе на винт со всеми картинками и css-ами;
3) Разбираешься как они это сделали (обрати внимание на эту строку

<input type=text name=story size=18 class=name onfocus="id=className" onblur="id=''"">

)