CSS搜索框

<title>CSS搜索框</title>
<style type="text/css">
.searchinput{
    border-right-width: 0px;
    padding-left: 3px;
    width: 168px;
    font-family: arial;
    float: left;
    border-top-width: 0px;
    border-bottom-width: 0px;
    color: #636365;
    margin-left: 4px;
    font-size: 8pt;
    vertical-align: middle;
    border-left-width: 0px;
    margin-right: 3px;
}
.tab_search{
    border-bottom: #cccccc 1px solid;
    border-left: #cccccc 1px solid;
    height: 25px;
    border-top: #cccccc 1px solid;
    border-right: #cccccc 1px solid;

}
.searchaction{
    width: 21px;
    float: left;
    height: 17px;
}
</style>
<form action="#" name="search">
<table border="0" cellpadding="0" cellspacing="0" class="tab_search">
    <tr>
        <td>
<input type="text" name="q" title="Search" class="searchinput" id="searchinput" onkeydown="if (event.keyCode==13) {}" onblur="if(this.value==‘‘)value=‘请输入商品关键字‘;" onfocus="if(this.value==‘请输入商品关键字‘)value=‘‘;" value="请输入商品关键字" size="10"/>
        </td>
        <td>
            <input type="image" width="21" height="17" class="searchaction" onclick="if(document.forms[‘search‘].searchinput.value==‘- Search Products -‘)document.forms[‘search‘].searchinput.value=‘‘;" alt="Search" src="images/searchbutton.gif" border="0" hspace="2"/>
        </td>
    </tr>
</table>
</form>

CSS搜索框,古老的榕树,5-wow.com

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。