Html 位置后的 Bootstrap glyphicon
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/29185207/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap glyphicon after position
提问by aleixfabra
The problem
问题
I want to display a glyphicon icon after a text. In the documentation, there are only before examples as you can see here: http://getbootstrap.com/components/#glyphicons-examples
我想在文本后显示一个字形图标。在文档中，只有前面的示例，您可以在这里看到：http: //getbootstrap.com/components/#glyphicons-examples
<div class="glyphicon glyphicon-chevron-right">Next</div>
My solutions
我的解决方案
Solution 1
解决方案1
<div>Next<span class="glyphicon glyphicon-chevron-right"></span></div>
Solution 2
解决方案2
#next.custom-chevron-right:after {
font-family: 'Glyphicons Halflings';
content: "\e080";
}
<div id="next" class="glyphicon custom-chevron-right">Next</div>
Source example: bootply
源示例：bootply
My question
我的问题
Is there a better way to do it just with bootstrap classes?
有没有更好的方法可以只使用引导程序类来做到这一点？
回答by Joe Conlin
There are 2 ways to typically add glyphicons (or any other icon font being used). The first way it to add them via html.
通常有两种方法可以添加字形（或正在使用的任何其他图标字体）。第一种方法是通过 html 添加它们。
<div>Next <span class="glyphicon glyphicon-chevron-right"></span></div>
// Be sure to add a space in between your text and the icon
The second way it to do it using CSS. At a minimum, you must includethe font-familyand character code.
第二种方法是使用 CSS 来实现。至少，你必须包含的字体家庭和字符代码。
<div><span>Next</span></div>
span::after {
font-family: 'Glyphicons Halflings';
content: "\e080";
}
Obviously, using the CSS method you can then add additional styling but this example shows you the minimum needed to get thte icon to appear in the relative correct place.
显然，使用 CSS 方法，您可以添加额外的样式，但此示例向您展示了使图标出现在相对正确的位置所需的最低限度。
回答by Runtuk
Your first solution is the best solution. There's not really any point in doing it another way as that's how you put glyphicons onto your website with Bootstrap anyway
您的第一个解决方案是最好的解决方案。以另一种方式这样做并没有任何意义，因为无论如何，这就是您使用 Bootstrap 将字形放在网站上的方式
