首页 > 解决方案 > Bootstrap Lumen 主题的 NavBar 问题

问题描述

我在我的 ASP.NET MVC 项目中包含了 bootstrap 的 lumen 主题,并将其替换为默认的 bootstrap.css 主题。现在我面临的问题是主题的导航栏看起来不应该是这样。实际上根本没有导航栏。

using System.Web;
using System.Web.Optimization;

namespace vidly
{
    public class BundleConfig
    {
        // For more information on bundling, visit https://go.microsoft.com/fwlink/?LinkId=301862
        public static void RegisterBundles(BundleCollection bundles)
        {
            bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/Scripts/jquery-{version}.js"));

            bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                        "~/Scripts/jquery.validate*"));

            // Use the development version of Modernizr to develop with and learn from. Then, when you're
            // ready for production, use the build tool at https://modernizr.com to pick only the tests you need.
            bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                        "~/Scripts/modernizr-*"));

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

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

在此处输入图像描述

标签: cssasp.netbootstrap-4navbar

解决方案


我遇到了同样的问题。根据我的调查,自从您正在使用的教程录制以来,流明主题代码发生了变化。结果,一些类名发生了变化。我没有时间将作者在教程中使用的 bootstrap-lumen.css 文件的源 css 代码与 bootswatch 上可用的实际文件进行比较。所以我决定快速解决这个问题......

这就是我解决这个问题的方法

1)去教程作者的GitHub(我不应该给他做广告并引用他的URL地址,但是如果你输入他的全名并添加单词“GitHub”你会找到它。

2)选择反映您正在创建的项目的存储库

3)查看该项目中的提交并转到第二旧的提交

4) 搜索名为 ../Content/bootstrap-lumen.css 的文件夹和文件

5)复制文件bootstrap-lumen.css的源代码

6) 将源代码粘贴到本地同名文件的实际源代码中

7)保存本地文件(Ctrl+S)并刷新浏览器

它对我有用。我希望它有所帮助,即使它不是最聪明的方式。


推荐阅读