Bootswatch 主题无法正常工作

Question

这是我第一次使用 ASP.NET，我正在尝试使用 Bootswatch 主题，但是当我尝试使用它时，页面顶部的导航栏变成了一个奇怪的下拉菜单.

我是不是做错了什么？我刚刚用 Bootswatch 的新 bootstrap.css 替换了当前 bootstrap.css。

Answer 1

问题是默认mvc模板中使用的bootstrap版本和bootswatch主题的版本不对应。

下载一个兼容的主题来修复它

The easiest will be to downgrade to boostwatch that's based on bootstrap3, bootswatch.com/3 , or alternatively you can update the html with the new bootstrap4 directives

感谢 StaticBeagle 的快速回答！

Answer 2

检查 Bootswatch 页面的兼容版本

1) https://bootswatch.com/

2) https://bootswatch.com/3/

试试这两个。其中之一应该可以工作

Answer 3

我遇到了同样的问题，并意识到在我的 bootswatch css 文件中它使用的是 v4.x，这是当前的最新版本。为了解决这个问题，我只是通过导航到以前版本的 bootswatch 并将 css 文件的文件内容复制到我的项目中来降级到 v3.x 并且它起作用了。这里是link降级后的版本https://bootswatch.com/3/lumen/#navbar

Answer 4

我遇到了同样的问题，解决此问题的最佳方法是降级或使用替代版本 3 或 4，方法是使用 import URL tag

@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,700,400italic");
/*!
 * bootswatch v3.4.1
 * Homepage: http://bootswatch.com
 * Copyright 2012-2019 Thomas Park
 * Licensed under MIT
 * Based on Bootstrap
*/
/*!
 * Bootstrap v3.4.1 (https://getbootstrap.com/)
 * Copyright 2011-2019 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */

这解决了我的问题，谢谢大家

Answer 5

Bootswatch 是一个很好的资源，但您也可以找到一些很好的资源，例如一些为 ASP.NET MVC 使用 MDBootstrap（构建在 Bootstrap) 这里：

ASP.NET MVC MDB Templates

Answer 6

您的 html

中可能缺少 Javascript 或 jquery 文件

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js></script>

将这些添加到您的 HTML

Answer 7

Bootswatch 使用 data-bs-toggle，但不起作用，我更改为 data-toggle，这刚好解决了我的问题

Bootswatch 主题无法正常工作

Bootswatch theme not working correctly

css

asp.net

asp.net-mvc

twitter-bootstrap

bootswatch