Navs

Documentation and examples for how to use Bootstrap’s included navigation components.

Titre section

<div class="actionbar">
  <div class="actionbar-head">
    <h1 class="h2 mb-0">Titre section</h1>
  </div>
</div>
<div class="actionbar has-tabs">
  <div class="actionbar-head">
    <h1 class="h2 mb-0">Titre section</h1>
  </div>
  <nav role="navigation" class="position-relative mt-2">
    <ul class="nav navtabs mb-0 dragscroll">
      <li class="navtabs-item pr-4">
        <a href="#" class="active" title="Titre onglet actif">Titre onglet</a>
      </li>
      <li class="navtabs-item pr-4">
        <a href="#">Titre onglet</a>
      </li>
      <li class="navtabs-item pr-4">
        <a href="#">Titre onglet</a>
      </li>
      <li class="navtabs-item pr-4">
        <a href="#">Titre onglet</a>
      </li>
      <li class="navtabs-item pr-4">
        <a href="#">Titre onglet</a>
      </li>
    </ul>
  </nav>
</div>
<div class="actionbar dark bg-teal has-tabs">
  <div class="actionbar-head">
    <h1 class="h2 mb-0">Titre section</h1>
  </div>
  <nav role="navigation" class="position-relative mt-2">
    <ul class="nav navtabs mb-0 dragscroll">
      <li class="navtabs-item pr-4">
        <a href="#" class="active" title="Titre onglet actif">Titre onglet</a>
      </li>
      <li class="navtabs-item pr-4">
        <a href="#">Titre onglet</a>
      </li>
      <li class="navtabs-item pr-4">
        <a href="#">Titre onglet</a>
      </li>
      <li class="navtabs-item pr-4">
        <a href="#">Titre onglet</a>
      </li>
      <li class="navtabs-item pr-4">
        <a href="#">Titre onglet</a>
      </li>
    </ul>
  </nav>
</div>
<div class="actionbar light bg-primary has-tabs">
  <div class="actionbar-head">
    <h1 class="h2 mb-0">Titre section</h1>
  </div>
  <nav role="navigation" class="position-relative mt-2">
    <ul class="nav navtabs mb-0 dragscroll">
      <li class="navtabs-item pr-4">
        <a href="#" class="active" title="Titre onglet actif">Titre onglet</a>
      </li>
      <li class="navtabs-item pr-4">
        <a href="#">Titre onglet</a>
      </li>
      <li class="navtabs-item pr-4">
        <a href="#">Titre onglet</a>
      </li>
      <li class="navtabs-item pr-4">
        <a href="#">Titre onglet</a>
      </li>
      <li class="navtabs-item pr-4">
        <a href="#">Titre onglet</a>
      </li>
    </ul>
  </nav>
</div>
Did you find what you’re looking for ? If not, please tell us .