42

所以我是 ASP.NET MVC 4 的新手(好吧,我用了 3 一点)。

无论如何,在我的 BundleConfig.cs 文件中,我正在尝试加载 Twitter Bootstrap css 文件和一个附加site.css文件。

但是只渲染了 site.css 文件。我已经确认引导 css 文件确实位于正确的位置(内容文件夹)并且与 site.css 位于同一位置

bundles.Add(new StyleBundle("~/Content/css").Include(
            "~/Content/bootstrap.min.css",
            "~/Content/bootstrap-responsive.min.css",
            "~/Content/site.css"));

编辑

好的,这不是我的首选方式,但 Andrei Drynov 建议我尝试:

@import url("bootstrap.min.css")
body{background: #e8e6da;padding-top:60px;padding-bottom:40px;}
@import url("bootstrap-responsive.min.css")

但这不起作用。我将 site.css 更改为上述内容,但现在背景主体颜色甚至不起作用。如果我删除@imports,则背景是正确的颜色。

编辑 2

我不明白,但补充说:

bundles.IgnoreList.Clear();

到我的捆绑文件修复它。嗯。不确定我是否理解。但我能够从 site.css 中删除 @imports。

奇怪的。

4

4 回答 4

87

IgnoreList 的默认行为是忽略任何缩小的脚本。

您可以从他们的名字中删除“.min”,或者清除 IgnoreList。

于 2012-11-25T22:08:54.753 回答
15

只是为了让其他人知道谁无法在这个长线程中轻松找到有效的解决方案,我遇到了完全相同的问题,我以与实际问题底部的编辑中建议的相同方式解决了它!

我开始了一个新项目 MVC4 Web 应用程序,用上面显示的完全相同的代码为引导程序包创建了路由:

bundles.Add(new StyleBundle("~/Content/css").Include(
            "~/Content/bootstrap.min.css",
            "~/Content/bootstrap-responsive.min.css",
            "~/Content/site.css"));

但是由于未知原因,它没有加载..最后我放弃了,决定用谷歌搜索,找到了这个页面。

我尝试在 BundleConfig.cs 文件中添加以下内容作为第一行。重新编译,一切开始工作,现在样式被正确加载。

bundles.IgnoreList.Clear();

也许这对某人有帮助。

于 2013-02-09T16:56:10.247 回答
2

我不使用 Bootstrap 的捆绑包(作为一个例外),但它的缩小版本,所以这对我有用:

<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--><html class="no-js"><!--<![endif]-->
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>@ViewBag.Title</title>
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width">
    <link rel="stylesheet" href="@Url.Content("~/Content/bootstrap.min.css")">
    <style>
        body {
            padding-top: 60px;
            padding-bottom: 40px;
        }
    </style>
    <link rel="stylesheet" href="@Url.Content("~/Content/bootstrap-responsive.min.css")">
    @Styles.Render("~/Content/less")
    @Scripts.Render("~/bundles/modernizr")
</head>
<body>

带有内联样式的部分来自http://www.initializr.com/的顶部 NavBar,如果不需要,只需删除。

或者,您可以在您的 styles.css 文件中执行相同的操作:

@import url('bootstrap.min.css');

body {
    padding-top: 60px;
    padding-bottom: 40px;
}

@import url('bootstrap-responsive.min.css');

You CSS Code below
于 2012-09-21T15:41:41.533 回答
1

正如保罗正确指出的那样,捆绑包设置为自动忽略“最小”文件。但是完全忽略此规则是一种不好的做法,请参阅此答案Bundler 不包括 .min 文件以获得更好的解决方案(检查第一个和第二个答案)。

于 2013-12-31T09:29:55.063 回答