Bootstrap Navbar 是位于网页顶部的导航标题,可以根据屏幕大小进行扩展或折叠。 Bootstrap Navbar 用于为我们的网站创建响应式导航。
我们可以使用 创建标准导航栏。我们还可以轻松创建不同的导航栏变体,例如带有下拉菜单和搜索框的导航栏以及固定的导航栏。下面是实现带有导航链接的简单静态导航栏的过程。
在 Bootstrap 中实现导航栏的分步指南
步骤 1:在所有其他样式表之前将 Bootstrap 和 jQuery CDN 包含到
标签中以加载我们的 CSS。第 2 步:在
标签中添加带有.navbar和.navbar-default 类的
第 3 步:添加带有 class container-fluid 的
标签,并添加另一个带有 class .navbar-header 的
以命名标题并在关闭
标签后添加导航列表。
注意:类.navbar-header是可选的。
我们已经成功地在 Bootstrap 中实现了 Navbar。
例子:
HTML
Bootstrap NavBar Example
Bootstrap Navbar Example
A navigation bar is a navigation
header placed at the top of the page.
输出: