twitter-bootstrap MVC4 中的 Bootstrap 和字体很棒

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/17351511/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-21 17:28:33  来源:igfitidea点击:

Bootstrap and font-awesome in MVC4

asp.net-mvc-4twitter-bootstrapfont-awesome

提问by morleyc

I am using MVC4 and have added Bootstrap and Font Awesome via nuget.

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

I can see how Bootstrap gets bundled in via BootstrapBundleConfig.cs(which was added by the nuget package) below:

我可以在下面看到 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"));
}

I have the following questions:

我有以下问题:

  1. For font-awesome, I don't see similar bundling code to the above for registering the required css files, is there any, or do i just link to the stylesheet in the content directory <link href="~/Content/font-awesome.min.css" rel="stylesheet" />- what is the proper way?
  2. For bootstrap, if I do not want a responsive layout, would I just comment out the bootstrap-responsive.css from Include("~/Content/bootstrap.css", "~/Content/bootstrap-responsive.css"))?
  1. 对于 font-awesome,我没有看到与上面类似的用于注册所需 css 文件的捆绑代码,有没有,或者我只是链接到内容目录中的样式表<link href="~/Content/font-awesome.min.css" rel="stylesheet" />- 正确的方法是什么?
  2. 对于引导程序,如果我不想要响应式布局,我是否可以将 bootstrap-responsive.css 注释掉Include("~/Content/bootstrap.css", "~/Content/bootstrap-responsive.css"))

回答by StanK

You can read more about how bundling works on the asp.netsite.

您可以在asp.net站点上阅读有关捆绑工作原理的更多信息。

It seems that the BootStrap nuget package has made some bundles for you. You could modify this to include Font Awesome in the existing bundle, or make it it's own bundle

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"));

}

Then, you need to make sure that your _layout.cshtmlrenders these bundles (the Bootstrap nuget may not have done this for you).

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

e.g.

例如

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

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

If you don't want to include ~/Content/bootstrap-responsive.css in your bundle, simple delete this string from the Includemethod.

如果您不想在包中包含 ~/Content/bootstrap-responsive.css,只需从Include方法中删除此字符串。