ASP.NET MVC5 Bootstrap CSS 搞乱导航？答案

【问题标题】：ASP.NET MVC5 Bootstrap CSS Messing Up Navigation?ASP.NET MVC5 Bootstrap CSS 搞乱导航？
【发布时间】：2018-06-04 22:57:12
【问题描述】：

目前是 ASP.NET 新手，目前正在学习如何更改主题。

我做了什么：

使用 VS2017，我启动了一个新的 ASP.NET Web 应用程序。这是我更改 CSS 之前的默认主题。
我从 https://bootswatch.com/lumen/ 获得了一个主题，并按照多个教程的指示将 Content/bootstrap.css 替换为新的主题代码。

完成这些步骤后，我的标题导航混乱并突然变成了一个难看的下拉菜单？

下面是它的实际外观。

谁能告诉我哪里出错了，或者我是否错过了任何步骤？我按照 T 的视频教程中的说明进行操作，我没有错过任何步骤，也无法实现相同的输出。唯一不同的是导师用的是VS2013。

【问题讨论】：

【解决方案1】：

我想您正在观看 Mosh Hamedani 制作的关于 ASP.NET MVC 5 的课程。您正在下载适用于 Bootstrap 4 的最新版 Bootswatch 主题。默认的 MVC 5 模板使用 Bootstrap 3。

您需要下载这个版本的 Lumen 主题：“https://bootswatch.com/3/lumen/”

或者，您可以通过更新 Bootstrap NuGet 包来升级到 Bootstrap 4。

【讨论】：

【解决方案2】：

如果您无法更新引导程序块。您可以在 Shared 文件夹内的 _Layout.cshtml 中更改 div 标签中的类。我所做的就是将代码更改为这种语法。

<div class="navbar navbar-expand navbar-fixed-top">

显示为<div class="navbar navbar-inverse navbar-fixed-top">

将类更改为navbar navbar-expand navbar-fixed-top，它将展开导航栏中的所有菜单，因为它只是被隐藏了。

【讨论】：

【解决方案3】：

另一种下载 Lumen 主题的 Bootstrap 3 版本的方法是通过 Bootswatch GitHub 存储库。

在撰写本文时，Bootswatch 主页顶部有指向 GitHub 存储库的链接，将您定向到下面的 URL。

【讨论】：