如何修复页面顶部的导航栏并在页面滚动时将其保留在那里

How can I fix a Navbar at top of page and have it remain there while page scrolls

本文关键字:滚动 保留 在那里 顶部 何修复 导航      更新时间:2023-09-26

当我使用...

<div id="stay">
<%= render 'layouts/navbar' %>
</div>
#stay ul.TabNav {
     background: #FFFFFF;
     border-bottom:solid 2px #00E5EE;
     padding:0 0px;
     font-size:13px;
     overflow:hidden;
     background:-moz-linear-gradient(0% 100% 90deg,#FAFAFA, #FFF);
     background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#FAFAFA), to(#FFF));
     position:relative;
     top:0px;
}

。它完美地固定在顶部。

我希望它保持在顶部,这样当页面向下滚动时

,它就会保持在顶部,并且在滚动时看起来就像它与页面一起向下浮动。

谢谢。

使用position: fixed; top: 0;并确保您的 html 具有文档类型

我建议你研究一下,并使用一些jquery来让它保持下去

这是一个帮助您入门的教程

http://net.tutsplus.com/tutorials/html-css-techniques/creating-a-floating-html-menu-using-jquery-and-css/