HTML example:
<!--
START: Nav Header
Additional Classes:
.nk-header-left
.nk-header-opaque
-->
<header class="nk-header nk-header-opaque">
<!--
START: Navbar
Additional Classes:
.nk-navbar-items-collapsed
.nk-navbar-lg
.nk-navbar-sticky
.nk-navbar-autohide
.nk-navbar-transparent
.nk-navbar-transparent-always
.nk-navbar-white-text-on-top
.nk-navbar-dark
-->
<nav class="nk-navbar nk-navbar-top">
<div class="container">
<div class="nk-nav-table">
<a href="index.html" class="nk-nav-logo">
<img src="assets/images/logo.svg" alt="" width="70" class="nk-nav-logo-img-dark">
<img src="assets/images/logo-light.svg" alt="" width="70" class="nk-nav-logo-img-light">
</a>
<ul class="nk-nav nk-nav-right d-none d-lg-block " data-nav-mobile="#nk-nav-mobile">
<li>
<a href="demo-minimal-split.html">
Demos
</a>
</li>
...
</ul>
<ul class="nk-nav nk-nav-right nk-nav-icons">
<li class="single-icon d-lg-none">
<a href="#" class="nk-navbar-full-toggle">
<span class="nk-icon-burger">
<span class="nk-t-1"></span>
<span class="nk-t-2"></span>
<span class="nk-t-3"></span>
</span>
</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- END: Navbar -->
</header>
<!-- END: Nav Header -->
- Navigation:
.nk-header-left– set navigation from top to left of the screen;.nk-header-opaque– opaque navigation;.nk-navbar-items-collapsed– collapsed menu items;.nk-navbar-lg– large height of menu;.nk-navbar-sticky– sticky navbar on page scroll;.nk-navbar-autohide– autohide navigation on page scroll down. Will show automatically when you scroll to top or when reaching the end of the page;.nk-navbar-transparent– transparent background color;.nk-navbar-transparent-always– transparent background color also after stick;.nk-navbar-white-text-on-top– white text when menu on the top of the page (not sticky);.nk-navbar-dark– dark style navbar;
