为什么引导图标没有改变它的大小？

【问题标题】：why is the bootstrap icon not changing its size?为什么引导图标没有改变它的大小？
【发布时间】：2022-08-21 19:06:49
【问题描述】：

这是代码：

<div class = \"banner-image w-100 vh-100 d-flex justify-content-center align-items- 
center\">
<div class = \"content text-center\">



  <i class=\"bi-chevron-compact-down bi-7x\"></i>

<p1 class = \"little text-white\">TUKLASIN&nbsp;&nbsp;  ANG&nbsp;&nbsp;   Hello</p1>

</div>
</div>

我在 Bootstrap5 中使用 cdn 进行安装。非常感谢您的帮助，非常感谢。

来自official documentation：我们建议使用width: 1em（可选高度：1em），以便通过font-size 轻松调整大小。 bi-7x 类是否存在？

标签： html css bootstrap-5 bootstrap-icons

【解决方案1】：

您可以使用 bootstrap fs- 类来更改图标的大小

<!DOCTYPE html>
<html>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css">
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.9.1/font/bootstrap-icons.css">
  <body>
    <div class="banner-image w-100 vh-100 d-flex justify-content-center align-items-
      center">
      <div class="content text-center">
        <i class="bi-chevron-compact-down fs-1"></i>

        <p1 class="little text-white">TUKLASIN&nbsp;&nbsp; ANG&nbsp;&nbsp; Hello</p1>

      </div>
    </div>
  </body>
</html>

fs- 可以是 1 到 6

【讨论】：