برای ایجاد نوار آدرس در بالای صفحه از تگ  <nav class=”navbar navbar-default”> استفاده می کنیم.

<nav class="navbar navbar-default">
  <div class="container-fluid">
    <div class="navbar-header">
      <a class="navbar-brand" href="#">COURSES</a>
    </div>
    <ul class="nav navbar-nav">
      <li class="active"><a href="#">Home</a></li>
      <li><a href="#">CSS</a></li>
      <li><a href="#">HTML</a></li>
      <li><a href="#">PHP</a></li>
    </ul>
  </div>
</nav>

درصورتیکه  تگ <ul class=”nav navbar-nav”> را نگذاریم نوار آدرس به صورت عمودی در سمت چپ صفحه قرار می گیرد.

درصورتیکه بخواهیم نوار آدرس تیره باشد از کلاس navbar-inverse استفاده می کنیم.

<nav class="navbar navbar-inverse">
  <div class="container-fluid">
    <div class="navbar-header">
      <a class="navbar-brand" href="#">COURSES</a>
    </div>
    <ul class="nav navbar-nav">
      <li class="active"><a href="#">Home</a></li>
      <li><a href="#">HTML</a></li>
      <li><a href="#">PHP</a></li>
      <li><a href="#">CSS</a></li>
    </ul>
  </div>
</nav>