0

当我开始向下滚动此网页时,Bootstrap 词缀插件会切入<header class="jumbotron subhead">- 此图像显示此症状:

在此处输入图像描述

我希望我的词缀导航不会切入并表现得像 Bootstrap 的官方文档中出现的那样,当您开始滚动时<header class="jumbotron subhead">它不会切入>。<header class="jumbotron subhead"有没有办法通过一些额外的 CSS 规则来解决这个问题?目前,如果您检查两个网站上的附加导航,我应用于 Affix 组件的 CSS 规则与 Bootstrap 文档中的 Affix 组件完全相同,所以我不明白为什么它无法正确显示。

CSS 规则:

.bs-docs-sidenav.affix {
    top: 40px;
}
.bs-docs-sidenav {
    width: 258px;
}
.bs-docs-sidenav {
    background-color: #FFFFFF;
    border-radius: 6px 6px 6px 6px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.067);
    margin: 30px 0 0;
    padding: 0;
    width: 228px;
}
.affix {
    position: fixed;
}
.nav-list {
    margin-bottom: 0;
    padding-left: 15px;
    padding-right: 15px;
}
.nav {
    list-style: none outside none;
    margin-bottom: 20px;
    margin-left: 0;
}
ul, ol {
    margin: 0 0 10px 25px;
    padding: 0;
}

我正在处理的网站(损坏的词缀):

http://www.bestcastleintown.co.uk/boot/test2.html#slides

引导网站(工作词缀):

http://twitter.github.com/bootstrap/javascript.html

4

1 回答 1

3

您现在需要做的就是定义导航栏粘贴后要放置的位置。在您的 stylesheet.css 更改中

.bs-docs-sidenav.affix {
top: 40px;
}  

类似于

.bs-docs-sidenav.affix {
top: 230px;
}  

希望这可以帮助!

于 2013-02-20T16:57:40.547 回答