我可以更改Font Awesome图标颜色的颜色吗？

12 回答

• 4

  这对我有用：

  .icon-cog {
    color: black;
  }
  

  对于 4.7.0 以上的Font Awesome版本，它看起来像这样：

  .fa-cog {
    color: black;
  }
  

  回复于 2024-05-02T23:52:01+08:00
• 37

  HTML：

  <i class="icon-cog blackiconcolor">
  

  css：

  .blackiconcolor {color:black;}
  

  你还可以在按钮图标上添加额外的类...

  回复于 2024-05-02T23:52:01+08:00
• 5

  您可以在style属性中指定颜色：

  <a href="/users/edit"><i class="icon-cog" style="color:black"></i> Edit profile</a>
  

  回复于 2024-05-02T23:52:01+08:00
• 7

  要更改整个项目的字体真棒图标颜色，请在css中使用此颜色

  .fa {
    color : red;
  }
  

  回复于 2024-05-02T23:52:01+08:00
• 1

  要仅触摸该按钮中的cog-icons，您可以为按钮指定一个类，并仅在按钮内部设置图标的颜色 .

  HTML：

  <a class="my-nice-button" href="/users/edit">
      <i class="icon-cog"></i>
      Edit profile
  </a>
  

  CSS：

  .my-nice-button>i { color: black; }
  

  这将使您的按钮的直接后代的任何图标变黑 .

  回复于 2024-05-02T23:52:01+08:00
• 24

  试试这个：

  <i class="icon-cog text-red">
  <i class="icon-cog text-blue">
  <i class="icon-cog text-yellow">
  

  回复于 2024-05-02T23:52:01+08:00
• -7

  如果你不想改变CSS文件，这对我有用 . 在HTML中，使用颜色添加样式：

  <i class="fa fa-cog" style="color:#fff;"></i>
  

  回复于 2024-05-02T23:52:01+08:00
• 5

  参考@ClarkeyBoy回答，如果使用最新版本的 Font-Awesome 图标或使用 fa 类，下面的代码可以正常工作

  .fa.icon-white {
      color: white;
  }
  

  然后，将 icon-white 添加到现有类

  回复于 2024-05-02T23:52:01+08:00
• 3

  .fa-search{
      color:#fff;
   }
  

  你在css中编写代码，它会将颜色更改为白色或任何你想要的颜色，你指定它

  回复于 2024-05-02T23:52:01+08:00
• 2

  只要给你任何你想要的风格

  style="color: white;font-size: 20px;"
  

  回复于 2024-05-02T23:52:01+08:00
• 0

  只要给你想要的文字样式：D HTML：

  <a href="javascript:;" class="fa fa-trash" style="color:#d9534f;">
     <span style="color:black;">Text Name</span>
  </a>
  

  回复于 2024-05-02T23:52:01+08:00
• 284

  HTML：

  <i class="icon-cog blackiconcolor">
  

  css：

  .blackiconcolor {color:black;}
  

  使用class将为您提供一个免费的绑定属性，您可以将其应用于您需要的任何标记 .

  回复于 2024-05-02T23:52:01+08:00