2

我已经广泛搜索了该网站，但找不到答案。请我是新手，我需要你的帮助。

我想创建一个固定的导航栏，但每次在我的 css 样式表中放置一个固定的规则时，导航栏就会消失。这是我的html代码：

<div id="container">
    <div id="nav-wrapper">
    <div id="nav">
        <a href="#">Link</a>
        <a href="#">Link</a>
        <a href="#">Link</a>
        <a href="#">Link</a>
        <a href="#">Link</a>
    </div>

这是jsfiddle链接

http://jsfiddle.net/ePttq/

非常感谢任何反馈。非常感谢！

4

4 回答 4

1

将这种z-index样式#nav写入#nav

#container {
    width: 900px;
    margin: 0 auto;
    position:relative;
    padding-top:50px;
}

#nav {
    height: 50px;
    background: #b7d84b;
    position:fixed;
    z-index:10;
    width:900px;
    top:0;
}

更新了 jsFiddle 文件

于 2013-08-14T07:10:26.927 回答
1

好的..这是你的答案：http: //jsfiddle.net/ePttq/3/

这是您需要在 CSS 中进行的更改：

#nav {
    height: 50px;
    background: #b7d84b;
    position:fixed;
    top:0px;
    left:0px;
    z-index:100;
    right:0px;
}

我已经修复了你的导航栏......即使在滚动时......这将继续工作:)

于 2013-08-14T07:16:54.740 回答
0 
#nav {
height: 50px;
background: #b7d84b;
position:fixed;
z-index:9999;
width:100%;
}
于 2013-08-14T07:29:28.427 回答
0

在导航 div 中使用以下内联样式：

<div id="nav" style="position:fixed;top:0;width:100%;z-index:10000">
            <a href="#">Link1</a>
            <a href="#">Link</a>
            <a href="#">Link</a>
            <a href="#">Link</a>
            <a href="#">Link</a>
        </div>
于 2013-08-14T07:15:53.123 回答