asp.net-mvc 为什么我的样式包不能在 ASP.NET MVC 4 中正确呈现？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12533591/
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
Why are my style bundles not rendering correctly in ASP.NET MVC 4?
提问by cbmeeks
So I am new to ASP.NET MVC 4 (well, I used 3 a little).
所以我是 ASP.NET MVC 4 的新手（好吧，我使用了 3 一点）。
Anyway, in my BundleConfig.cs file, I am trying to load the Twitter Bootstrap css files and an additional site.cssfile.
无论如何，在我的 BundleConfig.cs 文件中，我试图加载 Twitter Bootstrap css 文件和一个附加site.css文件。
But only the site.css file is rendered. I have confirmed that the bootstrap css files are indeed in the right place (Content folder) and are in the same location as the 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"));
EDIT
编辑
OK, this isn't my preferred way but Andrei Drynov recommended I try:
好的，这不是我的首选方式，但 Andrei Drynov 建议我尝试：
@import url("bootstrap.min.css")
body{background: #e8e6da;padding-top:60px;padding-bottom:40px;}
@import url("bootstrap-responsive.min.css")
But that doesn't work. I changed the site.css to the above but now the background body color doesn't even work. If I remove the @imports the background is the correct color.
但这不起作用。我将 site.css 更改为上述内容，但现在背景正文颜色甚至不起作用。如果我删除 @imports 背景是正确的颜色。
EDIT 2
编辑 2
I don't get it but adding:
我不明白，但补充说：
bundles.IgnoreList.Clear();
To my bundles file fixed it. Hmmm. Not sure I understand. But I was able to remove the @imports out of the site.css.
到我的捆绑文件修复它。嗯。不知道我明白。但是我能够从site.css 中删除@imports。
Strange.
奇怪的。
回答by paul
The default behaviour is for the IgnoreList to ignore any minified scripts.
默认行为是 IgnoreList 忽略任何缩小的脚本。
You can either remove the '.min' from their names, or clear the IgnoreList.
您可以从他们的名字中删除“.min”，或者清除 IgnoreList。
回答by Steve Johnson
Just to let anybody else know who cant find a working solution easily in this long thread, I had the exact same issue and i solved it in the same way as suggested in edits found at the bottom of the actual question!
只是为了让其他人知道谁无法在这个长线程中轻松找到有效的解决方案，我遇到了完全相同的问题，并且按照实际问题底部的编辑中建议的方式解决了它！
I started a new project MVC4 Web Application, created routes for bootstrap bundles in the exact same code shown above:
我开始了一个新项目 MVC4 Web 应用程序，在上面显示的完全相同的代码中为引导包创建了路由：
bundles.Add(new StyleBundle("~/Content/css").Include(
"~/Content/bootstrap.min.css",
"~/Content/bootstrap-responsive.min.css",
"~/Content/site.css"));
But due to unknown reasons, it was not loading.. Finally i gave up and decided to google it and found this page.
但是由于未知原因，它没有加载..最后我放弃并决定谷歌它并找到了这个页面。
I tried adding the following as the first line in BundleConfig.cs file. Recompiled and everything started working and now the styles were correctly being loaded now.
我尝试将以下内容添加为 BundleConfig.cs 文件中的第一行。重新编译，一切开始工作，现在正确加载样式。
bundles.IgnoreList.Clear();
Maybe this helps somebody.
也许这对某人有帮助。
回答by AFD
I don't use bundles for Bootstrap (as an exception), but its minified versions, so this works for me:
我不使用 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>
The part with the inline style is from http://www.initializr.com/for the top NavBar, if you don't need it, just remove.
内联样式的部分来自http://www.initializr.com/顶部导航栏，如果你不需要它，只需删除。
Alternatively, you can do the same in your styles.css file:
或者，您可以在 style.css 文件中执行相同操作：
@import url('bootstrap.min.css');
body {
padding-top: 60px;
padding-bottom: 40px;
}
@import url('bootstrap-responsive.min.css');
You CSS Code below
回答by FredericoR
As paul correctly stated, bundles as set to automatically ignore 'min' files. But ignoring this rule all together is a bad practice, please refer to this answer Bundler not including .min filesto a better solution (check both first and second answers).
正如 paul 正确指出的那样，捆绑包设置为自动忽略“最小”文件。但是一起忽略此规则是一种不好的做法，请参阅此答案Bundler not include .min files以获得更好的解决方案（检查第一个和第二个答案）。
