Question

我尝试使用font-awesome和social-buttons库中的图标，但它们显示为正方形：

No icons

代码：

<a class="btn btn-social-icon btn-google-plus"><i class="fa fa-google-plus"></i></a>
<a class="btn btn-social-icon btn-vk"><i class="fa fa-vk"></i></a>
<a class="btn btn-social-icon btn-twitter"><i class="fa fa-twitter"></i></a>
<a class="btn btn-social-icon btn-facebook"><i class="fa fa-facebook"></i></a>

输出.xhtml文件包含：

<head>
<link type="text/css" rel="stylesheet" href="/WebAcademy/javax.faces.resource/theme.css.xhtml?ln=primefaces-aristo">
<link type="text/css" rel="stylesheet" href="/WebAcademy/javax.faces.resource/bootstrap-3.2.0/css/bootstrap.min.css.xhtml?ln=styles">
<link type="text/css" rel="stylesheet" href="/WebAcademy/javax.faces.resource/font-awesome-4.1.0/css/font-awesome.css.xhtml?ln=styles">
<link type="text/css" rel="stylesheet" href="/WebAcademy/javax.faces.resource/bootstrap-social-gh-pages/bootstrap-social.css.xhtml?ln=styles">
</head>

所以，我想，css libs是导入的。

此外，我的 web.xml MIME映射：

<mime-mapping>
    <extension>eot</extension>
    <mime-type>application/vnd.ms-fontobject</mime-type>
</mime-mapping>
<mime-mapping>
    <extension>otf</extension>
    <mime-type>font/opentype</mime-type>
</mime-mapping>
<mime-mapping>
    <extension>ttf</extension>
    <mime-type>application/x-font-ttf</mime-type>
</mime-mapping>
<mime-mapping>
    <extension>woff</extension>
    <mime-type>application/x-font-woff</mime-type>
</mime-mapping>
<mime-mapping>
    <extension>svg</extension>
    <mime-type>image/svg+xml</mime-type>
</mime-mapping>

为什么图标显示为空方块的任何想法？

提前致谢。

字体很棒的图标显示为正方形

0 个答案: