字体真棒快捷方式

我在我的网络项目中使用 Awesome Font。是否有任何选项如何创建一堆图标的快捷方式？例如。我有circle-thin图标。现在在页面上我想将三个图标放在一起，所以结果是OOO，但我不想放 3x 次<i class="fa fa-circle-thin"></i>代码中。那么我可以以某种方式创建CSS快捷方式，当我编写它时，会出现3个圆圈吗？

Example:

.circle-three {
<i class="fa fa-circle-thin"></i>
<i class="fa fa-circle-thin"></i>
<i class="fa fa-circle-thin"></i>
}

然后在页面上我只会使用.circle_three类，而不是输入三次 Circle 代码。

两者都可以

• 添加一个新类并创建一个继承所有内容并仅添加您想要的更改的规则，以及
• 通过创建一个全新的类来完全替代原来的类。

由于唯一的属性很棒的 CSS 字体 for fa-circle-thin is the content of the before伪元素，因此没有其他可继承的内容，在这种情况下，两种解决方案（附加类或新类）具有相同的行为/含义。

.fa-circle-thin.triple::before {
    content: "\f1db\f1db\f1db";
}

<link rel="stylesheet" 
     href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
Standard : <i class="fa fa-circle-thin"></i>
Triple   : <i class="fa fa-circle-thin triple"></i>