Question

CSS 如何将搜索按钮做到框里？

就像这样 需要将右边放大镜和边框一起切 左边的边框单独切作为文本框背景吗？

Answer 1

你好！布局建议使用div里边放input和button的方式
<div style="border:1px solid #cccccc;width:150px;height:25px;">
<input type="text" style="border:0;margin-left:5px;width:110px;height:25px;line-height:25px;" />
<input type="button" value="" style="background:url(searchBtn.gif) no-repeat center center;width:15px;height:15px;margin:5px;" />
</div>
以上为大概思路，具体数值还需根据实际情况进行调整！

Answer 2

通常的做法
1、输入框边框隐藏
2、按钮与输入框位置调整
3、外面加一个层级标签加边框

Answer 3

提问者你理解错误了，边框是容器div的边框，文本框的边框是没有的。不然文本输入长了不就被按钮遮住了么？

追问

文本框会拉长遮住按钮吗?那这样就肯定不行，不过我吧放大镜切出来作为按钮的背景了。

追答

不会，是被按钮遮住文字。按照我的方法做就可以了，你可以参考一下淘宝之类的商城做法，没有人像你这样做的。

Answer 4

框的position:relative，按钮的position:absolute;right:0;top:0，然后根据你的实际情况微调就行

Answer 5

直接文本框把搜索按钮做背景图片，或者定位上去。