## Basics

Few tricks to know before continue to styles and variations.

###### UL Markup

###### Nav Markup

###### Aligned center

###### Aligned right

###### `.nav-fill`

###### `.nav-justified`

###### `.flex-column`

## Styles

Change the UI and colors with several utility classes.

###### `.nav-dark`

###### `.nav-light`

###### `.nav-uppercase`

###### `.nav-bold`

###### `.nav-bolder`

## Variations

Few more inline navigation types

###### `.nav-pills`

###### `.nav-slash`

###### `.nav-dot`

###### `.nav-iconic`

## In Page Navigation

A component which is fixed to one side of your page and can scroll to a section by selecting it.

Add the following code to the end of your HTML file (after footer), and don't forget to add id attribute to your sections. You can add `nav-page-left` class to the .nav-page element to place the navigation at the left side of the page. Please note that you can't have more than one .nav-page in your page.

You can change offset of navigation change by adding a `data-spy-offset="300"` to your `.nav-page`. Default value is 200.

    <ul class="nav-page">
      <li class="nav-item">
        <a class="nav-link active" href="#basics" title="Basic"></a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#styles" title="Styles"></a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#variations" title="Variations"></a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#in-page" title="In Page Navigation"></a>
      </li>
    </ul>