Author:
Maks
Snipp created on:
2012-09-16 17:17:03
Description:
Admin navbar example, a default navbar menu with icons for each menu item, user settings and logout dropdown.
Like Bootsnipp? Please give a tip:
<div class="navbar navbar-inverse">
<div class="navbar-inner">
<div class="container-fluid">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="#" name="top">Brand Name</a>
<div class="nav-collapse collapse">
<ul class="nav">
<li><a href="#"><i class="icon-home icon-white"></i> Home</a></li>
<li class="divider-vertical"></li>
<li class="active"><a href="#"><i class="icon-file icon-white"></i> Pages</a></li>
<li class="divider-vertical"></li>
<li><a href="#"><i class="icon-envelope icon-white"></i> Messages</a></li>
<li class="divider-vertical"></li>
<li><a href="#"><i class="icon-signal icon-white"></i> Stats</a></li>
<li class="divider-vertical"></li>
<li><a href="#"><i class="icon-lock icon-white"></i> Permissions</a></li>
<li class="divider-vertical"></li>
</ul>
<div class="btn-group pull-right">
<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
<i class="icon-user"></i> admin <span class="caret"></span>
</a>
<ul class="dropdown-menu">
<li><a href="#"><i class="icon-wrench"></i> Settings</a></li>
<li class="divider"></li>
<li><a href="#"><i class="icon-share"></i> Logout</a></li>
</ul>
</div>
</div>
<!--/.nav-collapse -->
</div>
<!--/.container-fluid -->
</div>
<!--/.navbar-inner -->
</div>
<!--/.navbar -->
Share this snipp:
Tweet