html - 如何使用 Bootstrap 为网页创建 Android 标签栏？

Question

如何使用 Bootstrap 为网页创建 Android 标签栏（示例标签栏 WhatsApp 应用程序）？感谢您的回答

标签： htmltwitter-bootstrapweb

Answer 1

您可以将引导nav组件与justified等宽导航项的选项一起使用，类似于 android 中的选项卡栏。

示例代码（来自Bootstrap 4.3文档）：

<nav class="nav nav-pills nav-justified">
  <a class="nav-item nav-link active" href="#">Active</a>
  <a class="nav-item nav-link" href="#">Much longer nav link</a>
  <a class="nav-item nav-link" href="#">Link</a>
  <a class="nav-item nav-link disabled" href="#" tabindex="-1" aria-disabled="true">Disabled</a>
</nav>