使用类型按钮输入图标内部的问题

Question

我有一个问题，我有2个按钮，你可以在下面看到。我需要添加errorIcon但是想要保持按钮1中的外观。按钮1具有浏览器指定样式，我没有对button1做任何事情。

HTML：

Button1: <input type="button" value="Button1" />
Button2: <input type="button" class="errorIcon" value="Button2" />

CSS：

 .errorIcon{
    background: url("errorIcon.png") no-repeat scroll top left;
    padding-left: 10px;
    width: 10px;
 }

请注意，我不能使用下面的示例，因为它触发了我无法做任何事情的事情。程序中的其他东西在“按钮”上运行。这个例子给我Button1错误img，因为我想要它。

<button><span class="errorIcon></span></button>

Answer 1

你需要设置两个按钮的样式，因为你保持第一个按钮没有样式，它会根据浏览器和系统改变外观。因此，他们两个风格

您可以使用这样的渐变来设置按钮样式 http://www.cssbuttongenerator.com/

通过:: before或:: after

添加图片