<input>是自关闭标记，不允许在其中包含任何其他元素。
以下是将其作为内联图标的所有3个可能选项。

• • 一个
• • 1.**将<i>和<input>按钮 Package 到<span>标签中，并使用一些自定义样式。

<span class="btn btn-warning">
    <i class="fa fa-times"></i> <input type="reset" value="Clear"/>
</span>

span > i {
    color: white;
}
span > input {
    background: none;
    color: white;
    padding: 0;
    border: 0;
}

• • 2.**使用<button type="reset">-建议使用。

<button class="btn btn-warning" type="reset">
    <i class="fa fa-times"></i> Clear
</button>

• • 3.**使用<a>定位标记+javascript

<a href="javascript:document.getElementById('myform').reset();" class="btn btn-warning">
    <i class="fa fa-times"></i> Clear
</a>

https://jsfiddle.net/a6s58Luj/3/

<input type="reset" class="NEWCLASS btn btn-warning" value="&#xf00d; Clear" />

通过添加value=" Clear"，你可以添加X图标。f00d是HEX/whatever图标，这是我从检查元素（检查::before的内容）中得到的。你可能需要考虑一些额外的样式，但它会起作用。只要记住设置字体。

如果您需要在表单中使用此选项，则不能使type=“reset”
最好的方法，我会说， Package 输入元素与标签和应用所有的css标签。所以任何点击标签将触发输入元素也。

<label classname="all css of your button">
    <input type="submit" value="submit">
    <i class="fa fa-times"></i>  
 </label>