MVC4 中的 Bootstrap 和 font-awesome

2024-03-04

我正在使用 MVC4 并通过 nuget 添加了 Bootstrap 和 Font Awesome。

我可以看到 Bootstrap 如何通过 via 进行捆绑BootstrapBundleConfig.cs(由 nuget 包添加)如下:

public static void RegisterBundles()
{
    BundleTable.Bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include("~/Scripts/bootstrap*"));
    BundleTable.Bundles.Add(new StyleBundle("~/Content/bootstrap").Include("~/Content/bootstrap.css", "~/Content/bootstrap-responsive.css"));
}

我有以下问题:

  1. 对于 font-awesome,我没有看到与上面类似的用于注册所需 css 文件的捆绑代码,是否有,或者我只是链接到内容目录中的样式表<link href="~/Content/font-awesome.min.css" rel="stylesheet" />- 正确的方法是什么?
  2. 对于 bootstrap,如果我不需要响应式布局,我只需注释掉 bootstrap-responsive.cssInclude("~/Content/bootstrap.css", "~/Content/bootstrap-responsive.css"))?

您可以阅读有关捆绑如何运作的更多信息asp.net http://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification site.

看来 BootStrap nuget 包已经为你制作了一些捆绑包。您可以修改它以将 Font Awesome 包含在现有捆绑包中,或者使其成为自己的捆绑包

e.g.

public static void RegisterBundles()
{
    BundleTable.Bundles
        .Add(new ScriptBundle("~/bundles/bootstrap")
        .Include("~/Scripts/bootstrap*"));

    // Either add it to the  existing bundle
    BundleTable.Bundles
        .Add(new StyleBundle("~/Content/bootstrap")
        .Include("~/Content/bootstrap.css", 
                "~/Content/bootstrap-responsive.css",
                "~/Content/font-awesome.css"));

    // Or make it it's own bundle
    BundleTable.Bundles
        .Add(new StyleBundle("~/Content/font-awesome")
        .Include("~/Content/font-awesome.css"));

}

然后,您需要确保您的_layout.cshtml渲染这些包(Bootstrap nuget 可能没有为您完成此操作)。

e.g.

@Styles.Render("~/Content/bootstrap")

// Or, if you made it it's own bundle
@Styles.Render("~/Content/font-awesome")

如果您不想在捆绑包中包含 ~/Content/bootstrap-responsive.css,只需从Include method.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

MVC4 中的 Bootstrap 和 font-awesome 的相关文章

随机推荐