内容向下滚动时的粘性导航栏[重复]

Question

我在我的应用程序中使用了两个导航栏。一个导航栏位于菜单的主布局中，另一个负责搜索文本框和一个按钮。

我试图让第二个导航栏保持粘性，这样当我向下滚动内容时它应该保持在屏幕顶部。

我尝试了navbar-fixed-top 属性。但它不起作用。 下面是使用的导航栏html：

<div id="dvHomeSearch">
        
            <nav class="navbar-header navbar-default homeTheme">
                <div class="container-fluid">
                    <div class="row" id="dvHomeSearchRow">
                        <div class="col-sm-1" style="padding-top:20px;">
                            <div style="text-align:center">
                                <a href='@Url.Action("Search","Home")' style="color:white">My Search</a>
                            </div>
                        </div>
                        <div class="col-sm-6" style="padding-top:14px">
                            <div class="form-group input-group" id="formUser">
                                <input type="text" id="txtHomeSearch" class="form-control input-md typeahead" placeholder="Search..." autocomplete="off" spellcheck="false" />
                                <span id="spnBtnSearch" class="input-group-addon" style="cursor:pointer" title="Search"><i class="glyphicon glyphicon-search"></i></span>
                            </div>
                            <div style="width:100%; text-align:center; vertical-align:top">
                                <span id="PopupMessage" style="display:none; background-color:#00ffff; color:black; font-size:10px">Search Intelligence is not available after complete type press tab</span>
                            </div>

                            <input type="hidden" id="hdnHomeSearch" />

                        </div>
                        <div class="col-sm-5">
                        </div>
                    </div>
                </div>
                <div style="height:100%">

                </div>
            </nav>     
    </div>
<div id="dvSearchGrid" class="container" style="width:100%">
Html Content....
</div>

请提出建议。

Answer 1

navbar-fixed-top 属性仅适用于“nav”元素，您可以在 Css 文件中尝试（位置：固定）