jquery实现固定导航栏

温柔女魔头

于 2019-01-29 17:42:04 发布

阅读量2.3k

点赞数 3

分类专栏： jQuery

本文链接：https://blog.youkuaiyun.com/qq_19880197/article/details/86693276

版权

本文介绍了如何结合HTML、CSS和jQuery技术，实现网页中头部导航栏的固定定位效果，确保用户滚动页面时导航栏始终保持可见。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

HTML

<body>
    <div class="top" id="topPart">
        <img src="images/top.png" alt="">
    </div>
    <div class="banner" id="bannerPart">
        <img src="images/barnner.png" alt="">
    </div>
    <div class="main" id="mainPart">
        <img src="images/main.png" alt="">
    </div>
</body>

CSS

*{
    padding: 0;
    margin: 0;
}
.top{
    vertical-align: top;
}
.main{
    width: 1000px;
    margin: 0 auto;
    padding-top: 10px;

}
.fixed{
    position: fixed;
    top: 0;
    left: 0;
}