导航类

AUI的顶部导航为6个色调(增加了.aui-bar-dark   color为#34495e),并对$api.fixStatusBar(el)做了兼容出来,在结合该属性使用时需要注意一点。

如果导航栏没有左右按钮时,必须要使用

<header class="aui-bar aui-bar-nav aui-bar-warning">AUI</header>

<header id="header"><div class="aui-bar aui-bar-nav"><div class="aui-title">名称</div></div></header>;

如果做有左右按钮可以直接:

<header id="header  class="aui-bar aui-bar-nav"><div class="aui-title">名称</div></header>;


<header class="aui-bar aui-bar-nav aui-bar-dark" style="margin-bottom:5px;"><div class="aui-title">顶部导航栏</div></header><header class="aui-bar aui-bar-nav aui-bar-dark" style="padding-top:25px; margin-bottom:5px">
    <a class="aui-pull-left">
        <span class="aui-iconfont aui-icon-left"></span>
    </a><div class="aui-title">fixStatusBar效果</div></header><header class="aui-bar aui-bar-nav aui-bar-dark" style="margin-bottom:5px;">
    <a class="aui-pull-left">
        <span class="aui-iconfont aui-icon-left"></span>返回
    </a><div class="aui-title">顶部导航栏</div></header><header class="aui-bar aui-bar-nav aui-bar-primary" style=" margin-bottom:5px;">
    <a class="aui-pull-left">
        <span class="aui-iconfont aui-icon-left"></span>
    </a><div class="aui-title">顶部导航栏</div></header><header class="aui-bar aui-bar-nav aui-bar-info" style="margin-bottom:5px;">
    <a class="aui-pull-left">
        <span class="aui-iconfont aui-icon-left"></span>
    </a><div class="aui-title">顶部导航栏</div></header><header class="aui-bar aui-bar-nav aui-bar-danger" style="margin-bottom:5px;">
    <a class="aui-pull-left">
        <span class="aui-iconfont aui-icon-left"></span>
    </a><div class="aui-title">顶部导航栏</div></header><header class="aui-bar aui-bar-nav aui-bar-warning" style="margin-bottom:5px;">
    <a class="aui-btn aui-btn-warning aui-pull-left">
        <span class="aui-iconfont aui-icon-left"></span>
    </a>
    <a class="aui-btn aui-btn-warning aui-pull-left active">
        <span class="aui-iconfont aui-icon-location"></span>
    </a><div class="aui-title">顶部导航栏</div><a class="aui-pull-right">
        <span class="aui-iconfont aui-icon-my"></span>
    </a>
</header>