如何修复包装内的导航栏

时间:2016-09-30 09:17:28

标签: html css

我想在向下滚动时修复包装器顶部的导航栏。
但当我把位置:固定在#nav ul中时,导航栏就会变成包装器。
这是我的html代码,导航栏里面应该是包装器

body{background-color  :    #C0C0C0;
     margin : 0px; 

}

#nav ul {   background-color: #333;
        list-style-type: none;
        text-align: center;
        top : 0px;
        width : 100% ;
        margin: 0;
        padding: 0;
        overflow: hidden;


        }

#nav li { 
      display: inline;


}

#nav li a {

     color: white;
     padding: 20px 30px;
     text-decoration: none;
     font-size : 40px;    
}

li a:hover {
    background-color: #111;
}

#wrapper { margin : 3% 5%;
           background-color: #FFF5EE;
           min-width : 400px;
           } 


#title {text-align : center;
       font-size : 30px;
       text-decoration: underline;
}

#content {padding : 3%;}

.first{border: 5px solid;}

这是我的css

UITabBarController

enter image description here

2 个答案:

答案 0 :(得分:0)

要将导航菜单固定到包装器,包装器元素将需要一个相对位置。

#wrapper {
    position:relative;
}

#nav ul {
    position:fixed;
    top:0;
    left:0;
}

答案 1 :(得分:0)

也许你可以使用z-index。使用z-index可以解决这个问题。我上周在我的网站上遇到了同样的问题