如何添加<a> link to an icon in bootstrap?</a>

Question

我有以下内容：

<a href="http://www.website.com" title="Website name">Website Link</a>

和

<i style="margin-right: 0.5em; color: #EEEEEE;" class="icon-home icon-4x"></i>

有人可以向我解释我如何将这些在引导程序中与我正在使用的字体真棒图标结合起来。我是否将<a>放在<i>或<i>内的<a>内，或者两者都需要在<div>内吗？

Answer 1

将<i>放在<a>

中

对于实例，

<a href="http://www.website.com" title="Website name"><i style="margin-right: 0.5em; color: #EEEEEE;" class="icon-home icon-4x"></i>Website Link</a>

Answer 2

这样，只有图标会显示：

<i style="margin-right: 0.5em; color: #EEEEEE;" class="icon-home icon-4x"></i>

使用此功能，将显示文本链接：

<a href="http://www.website.com" title="Website name">Website Link</a>

如果您想显示包含它们的文本和图标，请使用以下内容，将i标记放在a标记内：

<a href="http://www.website.com" title="Website name"> <i style="margin-right: 0.5em; color: #EEEEEE;" class="icon-home icon-4x"></i>Website Link</a>