仅在包含样式表时才加载图标

Question

我使用Semantic UI构建网站并使用Font Awesome图标。我注意到图标加载不正确，只是显示为正方形。但是，当我删除链接到我的CSS样式表的页面，图标DO显示正确。只要我把链接放回去，它们就会再次显示为正方形。

我觉得这很莫名其妙，有问题。任何想法可能会造成这种情况？我当然希望能够有一个页面的样式表！

Answer 1

我设法将问题定位到我的样式表的单个部分：* { font-family: Avenir, sans-serif !important; }我写了这条线来标准化网站字体，但它是与图标冲突的那条线。任何想法，为什么这是？和任何建议，以不会冲突的方式设置字体？

!important告诉属性忽略任何特异性。这意味着您的font-family声明将完全覆盖Font Awesome字体。

一般情况下，唯一的东西浏览器明确设置font-family上是html，body，input，select，textarea和button元素。考虑到这一点，你应该能够完全覆盖任何默认字体只需使用下列内容：

html, body, button, input, select, textarea { 
    font-family: Avenir, sans-serif; 
} 

如果不为你工作，检查你的网页，以确定您的自定义字体ISN”包括在内，并将这些选择器添加到上述声明中。

Answer 2

样式表可能会覆盖Font Awesome图标。如果有的话，你可以尝试从样式表中删除任何图标。让我知道这个是否奏效。