Navigation
A menu displays grouped navigation actions.
Example # Mobile
HTML
<nav class="bs-mobile-multilevel-menu" data-behavior-is="mobilemenu-nav">
<button class="bs-nav-trigger hamburger hamburger--spin">
<span class="hamburger-box">
<span class="hamburger-inner"></span>
</span>
</button>
<div class="bs-nav">
<div class="bs-nav__wrapper">
<ul class="bs-nav__main">
<li class="has-subnav">
<a href="#">Mobile nav 1 <button></button></a>
<ul class="bs-nav__sub">
<li class="has-subnav">
<a href="#">Mobile nav 1-level 1<button></button></a>
<ul class="bs-nav__sub">
<li><a href="#">Mobile nav 1-level 2</a></li>
<li><a href="#">Mobile nav 1-level 2</a></li>
</ul>
</li>
<li><a href="#">Mobile nav 1-level 1</a></li>
<li><a href="#">Mobile nav 1-level 1</a></li>
</ul>
</li>
<li><a href="#">Mobile nav 2</a></li>
<li><a href="#">Mobile nav 3</a></li>
<li><a href="#">Mobile nav 4</a></li>
<li class="has-subnav">
<a href="#">Mobile nav 5 <button></button></a>
<ul class="bs-nav__sub">
<li class="has-subnav">
<a href="#">Mobile nav 5-level 1<button></button></a>
<ul class="bs-nav__sub">
<li><a href="#">Mobile nav 5-level 2</a></li>
<li><a href="#">Mobile nav 5-level 2</a></li>
</ul>
</li>
<li><a href="#">Mobile nav 5-level 1</a></li>
<li><a href="#">Mobile nav 5-level 1</a></li>
</ul>
</li>
<li><a href="#">Mobile nav 6</a></li>
<li><a href="#">Mobile nav 7</a></li>
<li><a href="#">Mobile nav 8</a></li>
</ul>
</div>
</div>
</nav>