nav是什么?
导航
如何创立一个导航?
在ul元素里添加一个uk-nav的类可以创建导航。
<ul class="uk-nav">
<li ><a href="">item1</a></li>
<li ><a href="">item2</a></li>
<li ><a href="">item2</a></li>
</ul>
如图
image.png
侧边栏导航(面板里的导航)
可以先创建一个侧边的面板,然后把nav嵌套在里边,如下。添加uk-nav-side表面是侧边栏导航。
<div class="uk-panel uk-panel-box">
<h3 class="uk-panel-title">Nav</h3>
<ul class="uk-nav uk-nav-side">
<li ><a href="">item1</a></li>
<li ><a href="">item2</a></li>
<li ><a href="">item2</a></li>
</ul>
</div>
结果
image.png
抽屉中的导航
如下先建立一个激活抽屉的按钮。
接下来建立遮罩,uk-offcanvas
之后建立抽屉uk-offcanvas-bar
<!-- This is a button toggling the off-canvas sidebar -->
<button class="uk-button" data-uk-offcanvas="{target:'#my-id'}">canvas</button>
<!-- This is the off-canvas sidebar -->
<div id="my-id" class="uk-offcanvas">
<div class="uk-offcanvas-bar">
<ul class="uk-nav uk-nav-navbar">
<li>first</li>
<li>second</li>
<li>third</li>
</ul>
</div>
结果
image.png