Bootstrap5导航栏：快速实现响应式导航菜单

这篇文章介绍了使用Bootstrap5快速实现响应式导航菜单的方法。首先需通过CDN引入Bootstrap5的CSS和JS文件。基本结构包含`<nav>`标签配合`.navbar`类，核心组件有品牌标识（`.navbar-brand`）、导航容器（`.navbar-nav`）、导航项（`.nav-item`）、链接（`.nav-link`）、折叠按钮（`.navbar-toggler`）及折叠内容（`.collapse.navbar-collapse`），并提供示例代码。 响应式折叠逻辑通过`.navbar-expand-*`类控制，如`.navbar-expand-lg`使大屏幕（≥992px）展开，小屏自动折叠为汉堡菜单。样式定制支持背景色（`bg-*`）、文字色（`.navbar-dark/light`）、激活状态（`.active`）及下拉菜单（`.dropdown-*`）。 扩展功能包括固定顶部（`.fixed-top`）、右侧内容（如搜索框）和间距调整。注意事项：需确保CDN顺序正确，折叠按钮的`data-bs-target`与内容ID匹配，并添加无障碍属性提升兼容性。通过这些方法可快速实现响应式导航，无需额外CSS