html – 定位后的引导字形

前端之家收集整理的这篇文章主要介绍了html – 定位后的引导字形前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
问题

我想在文字后面显示一个glyphicon图标.在文档中,只有以下示例可以看到:http://getbootstrap.com/components/#glyphicons-examples

<div class="glyphicon glyphicon-chevron-right">Next</div>

我的解决方

解决方案1

<div>Next<span class="glyphicon glyphicon-chevron-right"></span></div>

解决方案2

#next.custom-chevron-right:after {
    font-family: 'Glyphicons Halflings';
    content: "\e080";
}
<div id="next" class="glyphicon custom-chevron-right">Next</div>

来源例:bootply

我的问题

有没有更好的方式来做只是与引导类?

谢谢!

解决方法

通常有2种方式添加glyphicons(或任何其他图标字体正在使用).通过HTML添加它们的第一种方式.
<div>Next <span class="glyphicon glyphicon-chevron-right"></span></div>
// Be sure to add a space in between your text and the icon

使用CSS的第二种方法.至少必须包含字体系列和字符代码.

<div><span>Next</span></div>

span::after {
    font-family: 'Glyphicons Halflings';
    content: "\e080";
}

显然,使用CSS方法,您可以添加额外的样式,但此示例显示了将图标显示在相对正确的位置所需的最低限度.

原文链接:https://www.f2er.com/html/229943.html

猜你在找的HTML相关文章