我正在使用Bootstrap,并希望在表单的提交按钮中放置一个图标。
这里是代码:
这里是代码:
<%= f.submit "Submit for Approval <i class='icon-share-alt icon-white'></i>",class: "button_green" %>
生成的HTML:
<input type="submit" value="Submit for Approval <i class='icon-share-alt icon-white'></i>" name="commit" class="button_green">
我尝试向文本添加raw和html_safe,但是似乎都没有起作用。
我知道一个解决方案是让类成为一个图标,其中已经有图标,但我想这样做,而不需要创建额外的图像/ CSS。有什么建议么?
解决方法
您可以通过使用button_tag来执行此操作:
<%= button_tag( :class => "button_green") do %> Submit for Approval <i class="icon-share-alt icon-white"></i> <% end %>
这将创建一个< button type =“submit”>< / button>元素与图标和文字内部。我已经测试了它的工作原理。 button_tag的默认操作是提交,因此,如果您需要一个不同的操作(例如取消例如),可以使用:type => “按钮”选项覆盖默认的提交行为。
编辑:对于Bootstrap 3,图标类名已更改,因此您可以放
<span class="glyphicon-white glyphicon-share-alt white"></span>
请注意,白色图标不再有特殊的类。只是做一个css类。白和放颜色:#fff ;.简单。您可以使用任何您喜欢的颜色或文字风格,因为图标现在是一种字体。
相关问题:Add Icon to Submit Button in Twitter Bootstrap 2和How do I change Bootstrap 3’s glyphicons to white?