3

基本上经过大量工作后，我终于设法在我的 ASP.NET MVC4 项目中使用 Bootstrap 启动并运行。

这是我的文件夹结构：

在此处输入图像描述

这是我的捆绑配置：

public static void RegisterBundles(BundleCollection bundles)
        {
            bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/Scripts/jquery-{version}.js"));

            bundles.Add(new ScriptBundle("~/bundles/bootstrapjs").Include(
                        "~/Scripts/bootstrap.js"));

            bundles.Add(new ScriptBundle("~/Content/bootstrapcss").Include(
                        "~/Content/bootstrap.css",
                        "~/Content/bootstrap-responsive.css"));
         }

但是，当我尝试添加带有图标的 HTML 元素时：

<button type="submit" class="btn"><i class="icon-search"></i></button>

图标不出现。

4

1 回答 1

2

最后一个包必须是 a StyleBundle，而不是 a ScriptBundle。这是我的一个项目中的一个示例：

bundles.Add(new StyleBundle("~/bundles/css").Include(
                        "~/content/css/bootstrap.min.css",
                        "~/content/css/font-awesome.min.css",
                        "~/content/css/common.css"));

我应该注意到我将我的 CSS 文件组织到一个特定的文件夹中，并且这个特定的项目使用FontAwesome代替 Glyphicons。

正如评论中所指出的，默认的 Bootstrap 包假定 CSS 文件位于一个文件夹中，并且图标精灵文件位于与 CSS 文件夹相同级别的另一个文件夹中。基于该假设，精灵的路径设置为"../img/glyphicons-halflings.png"。如果您的文件不在同一个地方，您需要手动编辑路径，或者使用定制器为精灵文件的浅色和深色版本构建具有正确路径的下载。

于 2013-09-15T21:43:49.713 回答