首页 > 解决方案 > 我如何使用 bootstrap4 在 html 中编码社交媒体图标

问题描述

我是 Web 开发新手,在我的 html 上写 facebook 图标时遇到问题,

<div class="container-fluid padding">
  <div class="row text-center padding">
    <div class="col-12">
      <h1>connect</h1>
    </div>
    <div class="col-12 social padding">
      <a href=""><i class="fab fa-facebook-f">facebook</i></a>
    </div>
  </div>
</div>

我试过这个但不工作

标签: bootstrap-4

解决方案


您尝试添加的图标<i class="fab fa-facebook-f"></i>是一个 Font Awesome Icon。除非您添加指向字体真棒图标库的链接,否则它将不起作用。

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" integrity="sha512-1ycn6IcaQQ40/MKBW2W4Rhis/DbILU74C1vSrLJxCq57o941Ym01SwNsOMqvEBFlcgUa6xLiPY/NS5R+E6ztJQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />

在你的 html 文件中添加上面的链接标签,<head>图标应该会显示出来。


推荐阅读