html 文本框内加按钮这种是怎么做的?

发布网友

我来回答

2个回答

热心网友

可以用定位来实现这种按钮,参考如下:

style部分参考如下:
.search { position:relative; width: 462px; }
.search .searchText { border: 1px solid #ddd; width: 346px; line-height: 32px; height: 32px; padding: 0 5px; color: #333; }
.search .searchButton { position:absolute; right:50px; background: url(../images/sliced.gif) -251px 0 no-repeat; width: 80px; height: 32px; text-indent: -9999px; border:none; }

html部分参考如下:
<div class="search fl">
<form action="#">
<input class="searchText" type="text" value="请输入搜索关键字" onfocus="if(this.value=='请输入搜索关键字')this.value=''" onblur="if(this.value=='')this.value='请输入搜索关键字'"/>
<input class="searchButton" type="button" value="搜索" />
</form>
<div class="clear"></div>
</div>

热心网友

边框加放大镜都是背景啊,把input放准位置,就行了

声明声明:本网页内容为用户发布,旨在传播知识,不代表本网认同其观点,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。E-MAIL:11247931@qq.com