实用搜索框样式
效果图:
参考网址:http://www.miiceic.org.cn/eg/eg9/sousuokuang.html
?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>安博中程企业培训,企业内训,专注于android培训,软考培训,软件开发,软件工程,嵌入式,UI设计,重构,架构等IT企业培训</title>
<meta name="keywords" content="企业培训,企业内训,android培训,软考培训,it企业培训"/>
<meta name="description" content="安博中程企业培训多年来致力于android培训,软考培训,嵌入式,UI设计,重构,架构,软件测试,需求分析,软件开发,数据库,国防军工等IT高端技术的企业培训、企业内训,一直在行业内处于领先地位,所开企业内训或公开课如软考培训,android应用开发培训,软件工程培训,敏捷开发,嵌入式培训,项目管理及国防军工的电子产品设计和信息化培训等授课讲师均是知名专家,行业内领军人物,已成为中国高端培训第一品牌."/>
<meta name="copyright" content="安博教育集团 中程在线北京科技有限公司版权所有"/>
</head>
<style>
.index_top_4 { float:left; height:33px; margin-top:22px; margin-left:27px; border-top:1px solid #c00; background:#3675b1 }
.select {border-top:1px solid #14528d;border-right:none;border-bottom:1px solid #14528d;border-left:1px solid #14528d;float:left;
display: inline;height:23px;padding-top:3px;padding-right:3px;margin-top:2px;margin-left:4px;background:#FFF;}
.select div {border:none;float: left;}
* html .select div select {display:block;float:left;margin:-2px;//控制option框的位置}
.select select>option {text-indent: 0px; //option在FF等非IE浏览器缩进2px}
.index_top_4 .index_top_4_1 { width:90px; border:0px; font-size:14px }
.index_top_4 .in1 { float:left; font-size:14px; width:283px; height:21px; padding-top:5px; padding-left:6px; margin-top:2px; border:1px solid #14528d }
.index_top_4 .in2 { float:left; margin-left:3px }
</style>
<body>
<form name="FormSearch2" method=post action="" selected="selected"> 安博中程</option>
<option value="2"> 公开课</option>
<option value="6"> 企业内训</option>
<option value="3"> 专家团队</option>
<option value="4"> 高端课程</option>
</select>
</div>
</div>
<input name="Keyword" onFocus="if(this.value=='请输入您想要了解的讲师或课程名称!'){this.value=''}" onBlur="if(this.value==''){this.value='请输入您想要了解的讲师或课程名称!'}" value="请输入您想要了解的讲师或课程名称!" input type="image" name="Submit" />
</form>
</body>
</html>
?
参考网址:http://www.miiceic.org.cn/eg/eg9/sousuokuang.html