有些织梦模板中没有搜索框,而站内搜索对用户体验也是很重要的一环,这个DIV+CSS演示地址可参考http://www.52fxzy.cn简洁好修改,直接上代码,如下:
CSS段:
#soutab { float: right; margin-right: 30px; margin-bottom: 20px; } .search { width: 335px; height: 36px; } .search .text { width: 243px; height: 28px; font-size: 16px; padding: 3px 0px; float: left; text-indent: 15px; color: #949494; border: 1px solid #ececec; border-radius: 3px; display: block; letter-spacing: 1.5px; font-family: "Microsoft Yahei", "冬青黑体简体中文 w3"; } .search .text:focus { color: #656565; } .search .button { height: 34px; width: 80px; margin-left: 10px; border: none; cursor: pointer; display: block; float: left; color: #fff; font-size: 15px; background: #d6623d; border-radius: 2px; } .searchtitle { height: 50px; line-height: 50px; background: #f7f7f7; margin: 0px 0px 0px -32px; border-left: 2px solid #d6623d; padding: 0px 55px; font-size: 18px; font-weight: normal; color: #150707; display: inline-block; }
大小颜色可根据自己网站自定
DIV段:
<div id="soutab"> <form class="search" name="formsearch" action="/plus/search.php"> <input type="hidden" name="kwtype" value="0" /> <input class="text" type="text" name="q" placeholder="搜索一下"> <input class="button" value="搜索" type="submit"> </form> </div>