Question

在样式包中添加font-awesome时，图像无法正确显示。而不是正确的图标，我得到一个透明的盒子。我的样式包设置如下：

 bundles.Add(new StyleBundle("~/Content/css").Include(
              //site bundles
 ).Include("~/Content/font-awesome/css/font-awesome.css", new CssRewriteUrlTransform()));

我检查了网站上的几个帖子，但似乎都没有解决这个问题。一如既往，我对此表示感谢。

麦克

Answer 1

假设在Content文件夹中有一个名为 fonts 的文件夹，其中包含字体很棒的字体文件，问题可能会归结为字体文件的文件路径（WOFF，WOFF2，SVG），EOT等）在font-awesome css文件中引用。可能是＆＃34; src＆＃34; @ font-face规则的属性是使用相对URL，例如＆＃34; ../ fonts / blah.woff＆＃34;。尝试使用删除＆＃34; ..＆＃34;并将网址设为＆＃34; /fonts/blah.woff"与css。

自：

    @font-face {
        font-family: 'FontAwesome';
        src: url('../fonts/fontawesome-webfont.eot?v=4.3.0');
        src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.3.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.3.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.3.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.3.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular') format('svg');
        font-weight: normal;
        font-style: normal;
}

要：

@font-face {
        font-family: 'FontAwesome';
        src: url('/fonts/fontawesome-webfont.eot?v=4.3.0');
        src: url('/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0') format('embedded-opentype'), url('/fonts/fontawesome-webfont.woff2?v=4.3.0') format('woff2'), url('/fonts/fontawesome-webfont.woff?v=4.3.0') format('woff'), url('/fonts/fontawesome-webfont.ttf?v=4.3.0') format('truetype'), url('/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular') format('svg');
        font-weight: normal;
        font-style: normal;
}

如果有效，请告诉我。

在MVC 5网站上使用font-awesome时没有图像

1 个答案: