在表单输入字段中放置图像答案

【问题标题】：placing an image in form input field在表单输入字段中放置图像
【发布时间】：2011-01-15 22:01:37
【问题描述】：

我正在尝试制作一个简单的表单输入字段，在右上角的字段内有一个图像，该图像用作提交按钮。这是我的演示http://jsfiddle.net/BSXsY/ 我想要输入字段内的图像类（.button）。感谢您的帮助。

【问题讨论】：

【解决方案1】：

要在输入字段中放置 astrik，您需要添加类。

代码如下：

<input type="text" class="astrik"/>

类的相应 CSS：

.astrik
{
     background-image: url('../images/red_asterik.png');
     height: 100%;
     width: 100%;
     background-repeat: no-repeat;
     background-position: right;
     background-position-x: 98%;
}

【讨论】：

【解决方案2】：

通过改变两件事，我很确定我已经完成了你所要求的：

.searchinput {
    color: #666666;
    font-size: 13px;
    padding-left: 2px;
    top: 5px;
    width: 200px;

    /* Additions (or rather copies) */
    background: url("http://img696.imageshack.us/img696/8137/13133747.jpg") right no-repeat;
    height: 25px;
}

注意高度已更改以适应图像，可能需要调整文本大小/对齐方式。

【讨论】：

谢谢这就是我想让它看起来的样子，但是正如我上面所说，我想将图像作为提交按钮，以便我单击它来提交表单。任何有关这方面的帮助都将非常受欢迎。
简答，你不能。您需要为这两个元素设置主题，使它们看起来紧密相关，就好像图像是一个按钮一样。我会到处玩并制作一个演示。