是否可以在表单提交按钮中使用 Glychicons？答案

【问题标题】：Is it possible to use Glychicons in form submit buttons?是否可以在表单提交按钮中使用 Glychicons？
【发布时间】：2013-09-03 23:17:46
【问题描述】：

制作带有字形图标的按钮没有问题，但我总是创建一个<a class="btn..."。这不起作用：<input type="submit" class="btn btn-default" value="" />。它只会产生一个空白按钮。

任何想法如何做到这一点？

【问题讨论】：

【解决方案1】：

过去我在使用<input> 标记时确实遇到过问题。也许您可以尝试使用<button> 之一。

这是 bootsrap 文档中所做的：

<button type="button" class="btn btn-default btn-lg">
  <span class="glyphicon glyphicon-star"></span> Star
</button>

如果需要，请参阅bootstrap documentation 了解字形图标。

希望对你有帮助：p

【讨论】：

【解决方案2】：

Glyphicons 使用“after”或“before”伪元素，非容器标签或自关闭标签（如输入）不支持这种元素。因此，如果您希望使用输入提交（是的，我了解您，我以前去过那里）重新创建它：

<span class="glyph class here"><input type="submit" value="whatever" /></span>

编辑，span 需要做一些调整，你需要让它看起来像一个按钮，然后对里面的提交按钮做更多的调整：

input[type="submit"] {
        display: inline-block;
        background-color: transparent;
        border: 0;
        cursor: pointer;
    }

【讨论】：

【解决方案3】：

这可以在仍然使用表单助手方法时完成。在此处查看解决方案：How to use Twitter Bootstrap's glyphicons with Rails's button_to

【讨论】：