Bootswatch 将 nav class 的定义从 block 更改为 flex？

Question

我正在学习使用 .net core、bootstrap 和 bootswatch 的教程。在教程中，有这个菜单：

<ul class="nav">
    <li><a asp-controller="App" asp-action="Index">Home</a></li>
    <li><a asp-controller="App" asp-action="About">About</a></li>
    <li><a asp-controller="App" asp-action="Contact">Contact</a></li>
    <li><a asp-controller="App" asp-action="Info">Info</a></li>
</ul>

在bower.json中，教程添加了bootstrap3.3.5和bootswatch 3.3.7。 .net core 2程序运行时，nav的样式为：

display: block

在英语中，菜单显示为 table，有 1 列和 4 行。

由于 bootstrap 和 bootswatch 4 已经在这里，我在 bower.json 中将它们升级到 4.1.0。令我惊讶的是，导航的 stylr 更改为：

display: flex

在英语中，菜单现在显示为 4 列但只有 1 行。

为什么 nav 的定义会改变？这是一个错误吗？

Answer 1

这不是错误。 Bootstrap 4 现在默认使用 flexbox。

因为是新的主要版本，所以有些东西已经改变了。

这是一个简单的垂直导航（注意添加的类）：

<nav class="nav flex-column">
  <a class="nav-link active" href="#">Active</a>
  <a class="nav-link" href="#">Link</a>
  <a class="nav-link" href="#">Link</a>
  <a class="nav-link disabled" href="#">Disabled</a>
</nav>

如您所见，您不再需要列表元素。但是，如果您想使用列表，请查看文档。

查看 docs 了解更多信息。

Bootswatch 将 nav class 的定义从 block 更改为 flex？

Bootswatch change definition of nav class from block to flex?

css

flexbox

bootswatch

twitter-bootstrap-3

bootstrap-4