Bootstrap 5-导航栏

导航栏容器

 • navbar

代码图

---

导航栏

 • navbar-nav

代码图

---

导航栏项

 • nav-item

代码图

---

导航栏链接项

 • nav-link

代码图

基本的导航栏

代码图

效果图

响应式导航栏

• navbar-expand-sm（小）

• navbar-expand-md（中）

• navbar-expand-lg（大）

• navbar-expand-xl（超大）

• navbar-expand-xxl（特大）

代码图

效果图

导航栏的位置

• justify-content-start（默认，左对齐）

• justify-content-center（居中对齐）

• justify-content-end（右对齐）

代码图

效果图

导航栏颜色

• bg-light（浅白色）

• bg-dark（黑色）

• bg-primary（蓝色）

• bg-success（绿色）

• bg-info（天蓝色）

• bg-warning（黄色）

• bg-danger（红色）

• bg-secondary（灰色）

所有的导航栏颜色效果图

 代码图

效果图

导航栏文本颜色

• navbar-dark（白色）

• navbar-light（黑色）

 代码图

效果图