Html 我想把我的图标放在圆的中间。 如何将我的图标放在圆的中间，基于下面的图片：

以下是我的HTML代码：

<footer>
    <div class="footer-bg-1">
      <h1 class="display-5" style="color: white">Find Me on</h1><br>
      <ul class="socialnetworks">
      <li>
          <a href="https://www.linkedin.com/" title="LinkedIn">
            <i class="fab fa-linkedin-in"></i>
          </a>
      </li>
      <li>
          <a href="https://github.com/" title="GitHub">
            <i class="fab fa-github"></i>
          </a>
      </li>
      <li>
          <a href="https://twitter.com/" title="Twitter">
            <i class="fab fa-twitter"></i>
          </a>
      </li>
    </div>
</footer>

---

您可以尝试以下方法：

.item{
边界半径：50%；
背景色：黑色；
边框：15px纯白；
宽度：50px；
高度：50px；
显示：内联flex；
}
身体{
背景色：黑色；
}
.项目一{
利润率最高：25%；
左边缘：25%；
颜色：白色；
}

添加任务
添加任务
添加任务

将行高设置为高度

行高：58px


ul.socialnetworks{
保证金：0；
边界：15px；
填充：0；
宽度：100%；
文本对齐：居中；
}
ul.社交网络>li{
显示：内联块；
}
ul.社交网络>li>a{
显示：内联块；
字体大小：25px；
线高：58px；
宽度：58px；
高度：58px；
边界半径：36px；
背景色：#313132；
盒影：0px 0px 2px白色；
颜色：白色；
利润率：0.4×3×0；
边界：8px固体；
}

在








带有class
.fab的图标具有参数
显示：内联块
。这意味着可以使用
vertical align:middle

只需将其添加到css中：

.fab {
  vertical-align: middle;
}


ul.socialnetworks{
保证金：0；
边界：15px；
填充：0；
宽度：100%；
文本对齐：居中；
}
ul.socialnetworks>li{
显示：内联块；
}
ul.socialnetworks>li>a{
显示：内联块；
字体大小：25px；
线高：50px；
宽度：58px；
高度：58px；
边界半径：36px；
背景色：#313132；
盒影：0px 0px 2px白色；
颜色：白色；
利润率：0.4×3×0；
边界：8px固体；
}
.晶圆厂{
垂直对齐：中间对齐；
}

在










.fab {
  vertical-align: middle;
}