Question

我正在使用uikit css框架，我想修复顶部的导航栏？

Answer 1

您需要包含＆＃39; components / sticky.js＆＃39;来自UIKit包的文件，并将data-uk-sticky指令添加到固定栏div。

例如：

<div data-uk-sticky>...</div>

我建议将它与navbar组件一起使用，例如：

<nav id='top-bar' class="uk-navbar" data-uk-sticky>
    <a href="" class="uk-navbar-brand">...</a>
    <ul class="uk-navbar-nav">...</ul>
    <div class="uk-navbar-content">...</div>
    <div class="uk-navbar-content uk-navbar-center">...</div>
    <a href="" class="uk-navbar-toggle"></a>
</nav>

Answer 2

将此添加到您的css文件中：

.uk-fixed-navigation {
    position: fixed;
    right: 0;
    left: 0;
    top: 0;
    z-index: 1030;
}

将uk-fixed-navigtion课程添加到导航栏。

修改

您也可以使用他们的sticky component

如何使用uikit修复顶部的导航栏？

2 个答案: