引导响应式导航菜单 - HTML

在现代网站设计中，响应式设计已经成为了必不可少的一部分。响应式导航菜单是其中的一个重要组成部分。

在 HTML 中，可以使用 Bootstrap 框架来快速地创建响应式导航菜单。下面是一个简单的示例代码片段：

<nav class="navbar navbar-expand-lg navbar-light bg-light">
  <a class="navbar-brand" href="#">Logo</a>
  <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>
  <div class="collapse navbar-collapse" id="navbarNav">
    <ul class="navbar-nav">
      <li class="nav-item active">
        <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">About</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Services</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Contact</a>
      </li>
    </ul>
  </div>
</nav>

该代码可以生成一个响应式导航栏，其中包括 Logo 和可以展开或收起的菜单列表。在移动设备上，可以通过点击导航栏按钮来展开或收起菜单。

此外，还可以通过 CSS 和 JavaScript 对响应式导航菜单进行更加定制化的设计。

总之，响应式导航菜单是网站设计中必不可少的一部分，而在 HTML 中，使用 Bootstrap 框架可以快速地创建出精美的响应式导航菜单。