为什么我的样式包在ASP.NET MVC 4中不能正确呈现？

所以我是ASP.NET MVC 4的新手（嗯，我用了3个）。为什么我的样式包在ASP.NET MVC 4中不能正确呈现？

无论如何，在我的BundleConfig.cs文件中，我试图加载Twitter Bootstrap css文件和一个额外的site.css文件。

但是只渲染了site.css文件。我已经证实，引导css文件确实是在正确的地方（Content文件夹），并在相同的位置的site.css

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

编辑

OK，这不是我的首选的方式，但安德烈Drynov建议我尝试：

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

但这并不行。我改变了site.css到上面，但现在背景主体颜色甚至不起作用。如果我删除@imports，背景是正确的颜色。

EDIT 2

我不明白这一点，但补充说：

bundles.IgnoreList.Clear();

要我包文件固定它。嗯。不知道我明白。但是我能够从site.css中删除@imports。

奇怪。

来源

2012-09-21 cbmeeks

如果您查看开发人员工具中的“网络”选项卡，是否获得了这些CSS文件？ – AFD

没有。我看到site.css和一些我加载的JS。 – cbmeeks

如何引用布局或视图中的包？ –

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

您可以从名称中删除'.min'，也可以清除IgnoreList。

来源

2012-11-25 22:08:54 paul

这是正确的答案。 Bundles会自动使用缩小的版本，所以不要在脚本名称中包含它，只需使用'bootstrap.css'，并将未缩小的版本保存在内容目录中。 –

我不使用引导束（作为例外），但其缩小的版本，所以这对我的作品：

<!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/的顶部导航栏中，如果你不需要它，只需删除。

或者，你可以做同样的在你的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-21 15:41:41 AFD

嗯，这当然有用，但我希望使用捆绑。我非常喜欢使用捆绑的想法。感觉'Rails'喜欢'给我。 :-) – cbmeeks

在您的更新中...将其导入site.css甚至更好。除非有人能够告诉我如何在捆绑中使用它，否则我会使用该方法。 – cbmeeks

@import网址无效。查看更新。谢谢 – cbmeeks

只是为了让别人知道着在这个漫长的线程很容易地找到可行的解决方案是谁，我有相同的问题，我解决它以同样的方式在实际问题的底部找到编辑建议！

我开始一个新项目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-09 16:56:10

这与Paul上面的答案一致，它指出'.min'文件在默认情况下被忽略。他还建议清除IgnoreList或重命名文件以删除.min。 – JLRishe

Thx a LOT！ IgnoreList是原因...为什么？ –

由于保罗正确指出，捆绑设置为自动忽略'min'文件。但是忽略这个规则是一个不好的做法，请参考此回答Bundler not including .min files以获得更好的解决方案（同时检查第一个和第二个答案）。

来源

2013-12-31 09:29:55 FredericoR

为什么我的样式包在ASP.NET MVC 4中不能正确呈现？

回答

相关问题