html - 在图标旁边添加文字

Question

如何在图标右侧插入文本(见图片)？

我有这段广告 facebook 图标的代码:

 <div class="col-sm-4 follow"> 
   <ul class="social">
     <li>
     <a title="" data-placement="top" data-toggle="tooltip" class="facebook" href="https://www.facebook.com" ><i class="fa
 fa-facebook"></i></a>
     </li> 
   </ul> 
 </div>

Answer 1

只需在图片后的链接内添加一个 span 标签...

HTML:

<div class="col-sm-4 follow ">
    <ul class="social">
        <li>
            <a title="" data-placement="top" data-toggle="tooltip"
               class="facebook" href="https://www.facebook.com">
                <i class="fa fa-facebook" id="facebook-icon></i>
                <span>Your Text Here</span>
            </a>
        </li>
    </ul>
</div>

CSS:

#facebook-icon,
#facebook-icon ~ span {display:inline-block;}