Question

Javascript怎样在输入框中放入图片按钮？

像这样，那个放大镜的按钮是如何放进输入框的

Answer 1

这不管javascript的事，是属于html和css的问题，给你点思路，自己试：

--------------------------------------------------

方法A：css相对定位嵌套绝对定位实现

--------------------------------------------------

1. 输入框和按钮共同的父级元素(比如：表单)相对定位输入框和按钮绝对定位
   

2. 输入框和按钮设置好宽、高，并绝对定位，需要时把按钮的z-index值设置为高于输入框

3. 上面两步做了以后，通过设置绝对定位元素的位置即可把按钮重叠到输入框上面去

4. 给输入框设个右边的内边距，让输入文字范围不会超过到按钮下面

5. 给输入框加上边框色，把按钮背景设置为透明，并给一个放大镜的背景图

--------------------------------------------------

方法B：css浮动实现

--------------------------------------------------

1. 输入框和按钮都用背景图做，把你这个图算好尺寸，切成左右两部分，如图：

   

2. 然后算好左右两部分加起来的总宽度，假设上图的输入框宽：80px，按钮宽：20px;

3. 给他们找个共同的父级div或直接用表单当父级，html就是下面这个结构：

   <div><输入框 /><按钮 /></div>

4. 设置父div总宽100px;，输入框和按钮都浮动：float:left;

5. 把输入框宽度设为80px，按钮宽20px;，并设置和图片一样的高度，然后分别后给相应的背景图。

6. 去掉输入框和按钮默认的边框、背景色之类的玩意。

7. 最后：清理浮动，解决FF、OP、SF、CH、IE8+等浏览器浮动包含问题
   

   
   

要学习，应该养成自己先思考或查看别人源码，确实不会再问的习惯。

Answer 2

1、用背景图片靠右对齐
2、文本框边框为0像素，外面套一个div，边框为2像素，蓝色，后面加一个图片。
<div style="border:1px solid #3CF"><input type="text" style="border-width:0px " value="请输入关键字搜索"><img src="fangdajing.png"></div>

Answer 3

css样式，可以整个button，设置margin-left

Answer 4

那个是DIV合并的