引导和字体真棒在MVC4 [英] Bootstrap and font-awesome in MVC4

查看:126
本文介绍了引导和字体真棒在MVC4的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用MVC4并增加了引导和字体通过的NuGet真棒。

我可以看到引导如何被通过 BootstrapBundleConfig.cs 捆绑在一起(这是由包的NuGet添加)如下:

 公共静态无效RegisterBundles()
{
    BundleTable.Bundles.Add(新ScriptBundle(〜/包/引导),包括(〜/脚本/引导*));
    BundleTable.Bundles.Add(新StyleBundle(〜/内容/引导),包括(〜/内容/ bootstrap.css,〜/内容/引导-responsive.css)。);
}

我有以下问题:


  1. 对于字体真棒,我没有看到类似的捆绑code以上登记所需的css文件,有没有,或者说我只是链接到样式表中的内容目录<链接HREF =〜/内容/ FONT-awesome.min.css的rel =stylesheet属性/> - 什么是正确的方法

  2. 对于引导,如果我不想要一个负责任的布局,将我只是注释掉引导-responsive.css包括(〜/内容/ bootstrap.css,〜/内容/引导-responsive.css))


解决方案

您可以阅读更多关于上的 asp.net 网站。

看来,引导的NuGet包做出一些对你的包。你可以修改这包括字体在现有的捆绑真棒,或使其它自己的包

例如

 公共静态无效RegisterBundles()
{
    BundleTable.Bundles
        。新增(新ScriptBundle(〜/包/引导)
        .INCLUDE(〜/脚本/引导*));    //要么将其添加到现有的束
    BundleTable.Bundles
        。新增(新StyleBundle(〜/内容/引导)
        .INCLUDE(〜/内容/ bootstrap.css
                〜/内容/引导-responsive.css
                〜/内容/字体awesome.css));    //或使其它自己的包
    BundleTable.Bundles
        。新增(新StyleBundle(〜/内容/ FONT-真棒)
        .INCLUDE(〜/内容/字体awesome.css));}

然后,你需要确保你的 _layout.cshtml 渲染这些软件包(引导程序的NuGet可能不这样做你)。

例如

  @ Styles.Render(〜/内容/引导)//或者,如果你成功了它自己的包
@ Styles.Render(〜/内容/ FONT-真棒)

如果您不想在您的包〜/内容/引导-responsive.css,简单的删除了包含法此字符串。

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

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

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

解决方案

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

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

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.cshtml renders these bundles (the Bootstrap nuget may not have done this for you).

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 Include method.

这篇关于引导和字体真棒在MVC4的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆