Question

此代码将文本右侧的左箭头定位。我更喜欢将glyphicon放在左边。

<button class="btn primary btn-lg" style="width:100%" >
    This way <span class="glyphicon glyphicon-arrow-left" style="align:left"></span>
</button>

感谢您的帮助

Answer 1

span显示Glyphicon。将span放在文本之前，它将如下所示位于左侧：

<button class="btn primary btn-lg" style="width:100%" >
    <span class="glyphicon glyphicon-arrow-left style="align:left" "></span>
    This way
</button>

Answer 2

只需将span放在文字前面。＆＃34;对齐＆＃34;属性是不必要的（并指出，不是一件事:)）。

<button type="button" class="btn btn-default btn-lg">
  <span class="glyphicon glyphicon-arrow-left" aria-hidden="true"></span> This Way
</button>

JSFiddle：https://jsfiddle.net/v49kj8sw/

文档：http://getbootstrap.com/components/#glyphicons-examples

Answer 3

首先，width:100%在bootstrap中没用。您应该使用col-lg-12，col-md-12，col-sd-12或col-xs-12，这会为元素增加100％的宽度。

其次，要将图标放在左侧，您必须先将span标记放在按钮中，如下所示：

<button class="btn primary btn-lg col-lg-12"><span class="glyphicon glyphicon-arrow-left style="align:left" "></span> This way</button>

Answer 4

我认为在css中没有名为align的属性。将text-align用于内联元素。或float左/右为元素，overflow:hidden为父/ clearfix黑客，或display:flex为justify-content: flext-start。

如何在引导按钮的左侧放置Glypicon？

4 个答案: