css - 如何构建 2 级引导导航栏？

Question

我想在 bootsrap 中重现这样的东西：

我想知道你是否可以帮助我，或者你是否知道任何可以工作的插件。这是出于公正的考虑。

提前谢谢你，对不起我的英语。

Answer 1

网上有关于如何制作 Bootstrap 导航栏的教程，所以我不会深入讨论，但是为了让两个东西只在页面的一侧重叠，你需要做这样的事情：

.container {
  display: flex;
  color: white;
  font-weight: bold;
  font-family: Sans-Serif;
}

.left {
  width: 50%;
  background-color: red;
  text-align: left;
}

.right {
  width: 50%;
  text-align: right;
}

.inner-right-1 {
  background-color: blue;
}

.inner-right-2 {
  background-color: green;
}

<div class="container">
  <div class="left">LEFT DIV</div>
  <div class="right">
    <div class="inner-right-1">TOP</div>
    <div class="inner-right-2">BOTTOM</div>
  </div>
</div>

有两个主要的 div（左和右），每个都占用x页面上的空间。在其中一个 div 中，放置两个内部 div，一个在另一个之上。在您的情况下，这些 div 每个都包含一个导航栏。