Bootstrap 4导航栏可以切换按钮，关闭之前打开的菜单，然后再打开另一个？

Bootstrap 4导航栏可以通过使用折叠组件来实现切换按钮、关闭之前打开的菜单，然后再打开另一个菜单的功能。

折叠组件是Bootstrap提供的一种交互式组件，用于在移动设备上实现导航栏的折叠和展开。通过添加一些特定的HTML结构和CSS类，可以轻松地实现导航栏的切换按钮和菜单的折叠效果。

具体实现步骤如下：

1. 在导航栏的HTML结构中，添加一个按钮元素，用于触发菜单的折叠和展开。可以使用<button>或<a>标签，并添加data-toggle="collapse"和data-target属性，分别指定折叠组件的行为和目标菜单的选择器。

示例代码：

<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
  <span class="navbar-toggler-icon"></span>
</button>

1. 在导航栏的HTML结构中，添加一个菜单容器元素，并设置一个唯一的ID作为选择器。可以使用<div>或<ul>标签，并添加collapse和navbar-collapse类，以及与按钮元素中的data-target属性相同的ID。

示例代码：

<div class="collapse navbar-collapse" id="navbarNav">
  <!-- 菜单内容 -->
</div>

1. 在菜单容器元素中，添加具体的菜单项。可以使用<ul>和<li>标签，根据需要添加链接或其他内容。

示例代码：

<ul class="navbar-nav">
  <li class="nav-item">
    <a class="nav-link" href="#">菜单项1</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" href="#">菜单项2</a>
  </li>
  <!-- 其他菜单项 -->
</ul>

通过以上步骤，就可以实现Bootstrap 4导航栏的切换按钮和菜单的折叠效果。点击按钮时，会自动折叠或展开菜单。

推荐的腾讯云相关产品：腾讯云服务器（CVM）和腾讯云CDN。

• 腾讯云服务器（CVM）：提供高性能、可扩展的云服务器实例，适用于各种应用场景。详情请参考腾讯云服务器（CVM）。
• 腾讯云CDN：提供全球加速、高可用的内容分发网络服务，可加速网站、应用、音视频等内容的传输。详情请参考腾讯云CDN。