1

我是图标字体的新手。

我看到 fontawesome 真的很棒，尤其是（从我的角度来看）fa-stack、fa-2x、fa-rotate-# 等类，因为它们增加了可用的图标。

丰泰罗也超级棒。特别是（再次从我的角度来看）因为我可以找到更多图标，并且只使用我真正需要的图标。但是，我在 fontello 生成的 css 中找不到所有那些很棒的 fontawesome 实用程序。

所以问题是：我可以将 fa-xxx 实用程序与 fontello 获得的任何图标一起使用吗？或者，我可以包含 fontawesome css 并将其成功应用于 fontello 图标吗？或者，是否可以将 fa-xxx 实用程序移植到 fontello.css 中？

更新：

我测试了这个场景：导入 fontawesome css 并将其应用于 fontello 图标；这是 Google Chrome v43 中的结果：

  • fa-stacked with mixed fontello 和 font-awesome 图标似乎可以工作（也许垂直居中并不完美，仍然很好）
  • fa-2x 工作
  • fa-flip-xxx 和 fa-rotate-xxx 不起作用
  • fa-spin 和 fa-pulse 确实有效
  • fa-border 做事

我不知道这是否适用于所有浏览器/平台。我不知道为什么翻转和旋转不起作用。

下一步可能是尝试将 fontawesome 类包含到 fontello-codes.css 中，以便仅使用 fontello 图标字体（ --> 较小的图标字体）

4

1 回答 1

0

我对你的问题有部分答案。

为了仅使用 fontello 来调整图标的大小，请使用以下 css：

 .fa-1x {
    font-size: 1em;
  }
  .fa-2x {
    font-size: 2em;
  }
  .fa-3x {
    font-size: 3em;
  }
  .fa-4x {
    font-size: 4em;
  }
  .fa-5x {
    font-size: 5em;
  }

要让图标旋转，请包含 fontello 的动画 css 文件，以便您可以像这样使用“animate-spin”：

<i class="icon-phone animate-spin fa-2x">

我目前与您在撰写问题时处于同一点，我现在正在使用堆叠功能，如果我找到它，我会更新我的答案。如果您已经弄清楚了，请随时分享:-)

于 2016-04-08T17:12:25.953 回答