css - font-awesome 在 MVC5 中不工作 bundleconfig

标签 css twitter-bootstrap fonts asp.net-mvc-5 font-awesome

如果我直接引用_layouts页面中的font-awesome.css。它会起作用

<link href="~/Content/font-awesome-4.0.3/css/font-awesome.css" rel="stylesheet" />

但是我在BundleConfig.cs中使用了。图标未显示。

 bundles.Add(new StyleBundle("~/Content/css").Include(
                        "~/Content/font-awesome-4.0.3/css/font-awesome.css",
                        "~/Content/bootstrap.css",                        
                         "~/Content/body.css",
                        "~/Content/site.css",
                        "~/Content/form.css"
                     ));

我还观察到浏览器控制台对字体目录有错误。 加载资源失败:服务器响应状态为 404(未找到)http://localhost:51130/fonts/fontawesome-webfont.woff?v=4.0.3

可能是什么问题?

最佳答案

尝试在捆绑时使用 CssRewriteUrlTransform:

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

这会将 css 文件中的 Assets 的任何 url 更改为绝对 url,因此捆绑不会弄乱相对路径。

CssRewriteUrlTransform 的文档

关于css - font-awesome 在 MVC5 中不工作 bundleconfig,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22700385/

相关文章:

android - 如何为操作栏文本设置自定义字体,并使其在启动时发生?

javascript - 向下滚动时导航栏更改背景,但向上滚动时不会变回

css - IE6 - h3 上方出现太多间距,我该如何摆脱它?

css - 悬停时扩展文本

html - Bootstrap 3 : How to fit responsive table in the container?

css - 将新字体添加到 TinyMCE 字体选项

html - 尽管没有报告错误,但 CSS 文件中的 @Font-face 无法正常工作

css - 这段 CSS 代码对 wordpress 网站有什么影响?

css - 附加到视口(viewport)底部的 DIV

html - Bootstrap 3 选项卡悬停样式问题