<html>
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312">
<title>请选择ABCDEFGHI_select横排效果</title>
</head>
<body>
<style>
*{font-size:12px}
A.s_l {
BORDER: #dddddd 1px solidBORDER-right: #dddddd 0px solidBACKGROUND: #ffffffPADDING: 4px 6px 2px 6pxTEXT-DECORATION: noneline-height:12px
}
A.s_l:hover {
BORDER: #003366 1px solidBORDER-right: #dddddd 0px solidBACKGROUND: #0063dcCOLOR: #ffffffTEXT-DECORATION: noneline-height:12px
}
A.s_r {
BORDER: #dddddd 1px solidBACKGROUND: #ffffffPADDING: 4px 6px 2px 6pxTEXT-DECORATION: noneline-height:12px
}
A.s_r:hover {
BORDER: #003366 1px solidBACKGROUND: #0063dcCOLOR: #ffffffTEXT-DECORATION: noneline-height:12px
}
input{BORDER: #aaa 1px solidwidth:65pxheight:23pxPADDING: 4px 6px 0px 6pxbackground:url(images/a.jpg) no-repeat 95% center}
.span1{position:relativetop:3px}
.span2{position:relativeleft:-3pxtop:1px}
</style>
<span class="span1"><input type="text" value="请选择" onclick="sele(this)"></span>
<span class="span2" id="select" style="display:none"><A class=s_l
href="###">A</A><A class=s_l
href="###">B</A><A class=s_l
href="###">C</A><A class=s_l
href="###">D</A><A class=s_l
href="###">E</A><A class=s_l
href="###">F</A><A class=s_l
href="###">G</A><A class=s_l
href="###">H</A><A class=s_r
href="###">I</A></span>
<script>
function sele(o){
var oobj=document.getElementById("select")
if (oobj.style.display=="none"){
oobj.style.display=""
var obj=oobj.getElementsByTagName("a"),j=obj.length
for (var i=0i<ji++){
obj[i].onclick=function(){
o.value=this.innerHTML
oobj.style.display="none"
}
}
}
else oobj.style.display="none"
}
</script>
</body>
</html>
您可以自己修改相应的样式和代码！希望对您有帮助！
<input type="text" id="TextBox_Search" value="请输入搜索的关键字" onFocus="if(this.value=='请输入搜索的关键字'){this.value=''
}"
onblur="if(this.value==''){
this.value='请输入搜索的关键字'
}"
/>
这段怎么看都别扭，你看看有没有人这样写
