jquery - 向输入提交添加图标

Question

如何在输入提交的开头添加图标？

我的提交在这里：

<div class="prodbox" style="height: 55px;">
    <div class="pricetag">
        <input type="submit"  
               class="productcart"
               alt="Add to Cart"
               value="ADD TO CART"/> 
    </div>
</div>

这是我想加上前缀的图像：

目前的样子：

Answer 1

用按钮替换您的提交输入：

<button class="productcart" name="Add to Cart">
    <img src="http://www.amleo.com/images/art/glyphicons_190_circle_plus.png">
    ADD TO CART
</button>

或者将图标定义为提交输入的背景：

.productcart {
    padding-left: 30px;
    background: url('http://www.amleo.com/images/art/glyphicons_190_circle_plus.png') no-repeat;
}

Answer 2

好的，所以我认为你应该只通过 CSS 来做。这是代码：

.pricetag input[type="submit"]{
    background: url(../images/icon-plus.png) 5px center no-repeat #F60;
    color:#FFF;
    padding: 5px;
}

解释：

• 在背景中将图像和颜色一起添加
• 将背景位置 5px 或其他东西设置为向左并垂直居中。
• 将背景重复设置为不重复。
• 根据需要添加其他CSS。

祝你好运！！