Question

我查了几个主题我这个有点新，我发现了一个相似但不一样的情况。

所以，我的项目与sass和font-awesome完美配合。

我正在导入font-awesome scss文件：

//libs
@import "css/font-awesome/scss/font-awesome";

我正在使用的sass课程

&:hover { 
    font-family: FontAwesome;
    content: $fa-var-android;
}

我不想使用font-family：FontAwesome;在每个班级中，这都是一种使用方式吗？

&:before {
    content: $fa-var-android;
}

甚至更好：只是unicode？

&:hover {
    content: '\f26e';
}

我试过但没有用，有人可以帮我一个忙吗？

谢谢。

Answer 1

这是一个解决方案，使用字体系列的通用类。

<强> HTML

.a{
  font-family: FontAwesome;
}
.b:before{
  content: '\f26e';
}
.b:hover:before{
  content: '\f2a3';
}

<强> CSS

cups4j

Answer 2

&:hover {
content: '\f26e';
}
&:before {
content: '\f003';
}
&:hover, &:before {
font-family: FontAwesome
}

因此，您可以在逗号后添加所需的所有类和伪类，并一次性包含字体系列！

Answer 3

我为此目的创建mixin，并在family-font中包含FontAwesome content和$icon: 'bar'; $icon-2: 'baz'; @mixin fa($icon){ font-family: FontAwesome; content: $icon; } .foo{ @include fa($icon); &:before{ @include fa($icon-2); } }变量：

.foo {
  font-family: FontAwesome;
  content: "bar";
}

.foo:before {
  font-family: FontAwesome;
  content: "baz";
}

输出：

SELECT BLC.LABEL_COLECCTIONS_ID
     FROM  BET_LABELS BL, 
        BET_LABEL_SEASONS BLS, 
        BET_LABEL_COLLECTIONS BLC
        WHERE BLC.LABEL_ID = BL.LABEL_ID 
        AND BL.LABEL_ID = BLS.LABEL_ID 
        AND blc.collection_id = 6470
        AND BLS.SEASON_ID = 71
        AND blc.label_colecctions_id NOT IN (
                                          SELECT gp.label_colecctions_id
                                          FROM GPE_PRICES GP, gpe_collection_assignements GCA
                                          WHERE gp.collection_assignement_id = GCA.collection_assignement_id
                                          AND GCA.collection_assignement_id = 101591665 and gca.season_id = 71
                                          );

Answer 4

感谢您的帮助，我同意上述答案，但这些仅适用于少数几个课程，而不是我的所有课程。理解？

所以我找到了一个更好的方法来做到这一点：

body {
  font-family:  FontAwesome,Helvetica;
}

所以我可以使用unicode和变量，而且我不需要在我的课程中编写font-family。

&:before {
    content: $fa-var-android;
}


&:hover {
    content: '\f26e';
}

谢谢。

在内容css中使用sass的字体很棒

4 个答案: