Html 如何将字体图标添加到<；输入>；按钮

我正在尝试添加一个带有字体图标的

我可以通过超链接或按钮来实现这一点，但如果我走这条路，我需要使用jQuery/JS来清除表单，这是我目前正在努力避免的

我很好奇是否有可能达到同样的结果。请看这篇文章，看看我的意思

输入重置：
清楚的




按钮：
清楚的




主播：

如果没有其他方法，我将实现jQuery解决方案。

是自动关闭标记，不允许在其中包含任何其他元素

以下是作为内联图标执行此操作的所有3个可能选项

1。将

和

按钮包装成带有一些自定义样式的

标记

<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;
}

span>i{
颜色：白色；
}
span>输入{
背景：无；
颜色：白色；
填充：0；
边界：0；
}

2.使用

-推荐的

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

清楚的

3.使用

---

通过添加

value=“；Clear”

可以添加X图标

f00d

是图标HEX/whatever，我通过检查元素（检查

：：在
的内容之前）得到它。您可能需要研究一些额外的样式，但它会起作用。记住设置字体。
哦，你也不必使用我创建的新类。这只是为了区别于其他按钮。点击Snorlax谢谢。我只需要弄清楚如何使用按钮上的默认字体以及很棒的字体。注意它是如何剥离样式的。这也是我看到的。不幸的是，我99.9%肯定你不能做到这一点。你不能“只在一种字体中完成一半的文字，而在另一种字体中完成另一半的文字”。那不行。这是一种有趣的按钮类型，但我会立即使用jQuery。这是一种非常聪明的方法，顺便说一句，请确保测试字体是否不会导致正常文本显示出现任何其他问题。是的。您可能需要将
font系列
更改为
font:normal 14px/1字体就像原来的一样。
<a href="javascript:document.getElementById('myform').reset();" class="btn btn-warning">
    <i class="fa fa-times"></i> Clear
</a>

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