--- layout: page title: Navs --- Navigation available in Bootstrap share general markup and styles, from the base `.nav` class to the active and disabled states. Swap modifier classes to switch between each style. ## Regarding accessibility If you are using navs to provide a navigation bar, be sure to add a `role="navigation"` to the most logical parent container of the `

` element around the whole navigation. Do not add the role to the `

` element. {% example html %} {% endexample %} ## Tabs Takes the basic nav from above and adds the `.nav-tabs` class to generate a tabbed interface. Use them to create tabbable regions with our [tab JavaScript plugin](../javascript/tabs). {% example html %}

{% endexample %} ## Pills Take that same HTML, but use `.nav-pills` instead: {% example html %}

{% endexample %} ## Stacked pills Just add `.nav-stacked` to the `.nav.nav-pills`. {% example html %}

{% endexample %} ## Using dropdowns Add dropdown menus with a little extra HTML and the [dropdowns JavaScript plugin]({{ site.baseurl }}javascript/#dropdowns). ### Tabs with dropdowns {% example html %}

{% endexample %} ### Pills with dropdowns {% example html %}

{% endexample %}