如何定位字体真棒图标？

Question

我正在尝试定位一个字体真棒图标 - 一个堆积在圆圈顶部的惊叹号 - 就像这样：

发生的事情是这样的：

什么是新的

<span class="fa-stack">
    <i class="fa fa-circle fa-stack-1x" style="color:red"></i>
    <i class="fa fa-exclamation fa-stack-1x" style="color:white"></i>
</span>

Answer 1

What's New<sup><i class="fa fa-circle fa-stack-1x" style="color:red"></i></sup> 在font-awesome图标之前删除空格并将代码放在上标

中

Answer 2

使用边距。在这种情况下，我使用了负边距。

Answer 3

.fa-stack {
    z-index: 100;
    margin-left: -20px;
}

Z-index确保图标位于文本顶部。根据您的构建方式，您可能需要也可能不需要添加它。数字只需要高于文本的z-index（100是任意的）。

负边距会将其移除。