css - Bootstrap 和其他字体图标冲突

Question

我在我的项目中使用 bootstrap3。现在我想使用一些字体图标，除了它的核心图标。首先我尝试了 Font Awesome4，但似乎有一些问题，图标显示为正方形。我也尝试了 FlatUI 图标，但出现了同样的问题..

有人有这个烦恼吗？我该如何解决？

---

编辑

例如对于fontawesome，我将下面的链接放在我的标题中

<link href="{{ asset('css/font-icon/css/font-awesome.min.css') }}" rel="stylesheet" />

我也尝试过使用cdn

<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">

我用萤火虫检查了它，字体已加载，但看起来像一些正方形：|

Answer 1

I think I have found the solution, maybe dirty one..

I added this lines to my css:

[class*="fa-"]{
display: inline-block;
font-family: 'FontAwesome' !important;
font-style: normal;
font-weight: normal;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

and also these ones to my .htaccess

AddType application/vnd.ms-fontobject .eot
AddType font/ttf .ttf
AddType font/otf .otf
AddType application/x-font-woff .woff

<FilesMatch "\.(ttf|otf|eot)$">
    <IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
</IfModule>