내비게이션 막대 - 고정 위치

Question

웹 사이트의 페이지를 아래로 스크롤 할 때 사이트의 탐색 표시 줄이 고정되어 있어야합니다. 지금까지 고정 된 코드를 가지고 있다고 생각하지만 아래로 스크롤하면 페이지의 이미지/섹션에 대해 투명하게 나타납니다. 섹션이 뒤쪽으로 스크롤되도록 나타납니다. 난 당신이 <nav>에 z-index:999을 사용한다고 생각

<header> 
     <nav> 
      <a href="#logo">Home</a> 
      <a href="#whatwedo">What we do</a> 
      <a href="#whoweare">Who we are</a> 
      <a href="#partners">Who we work with</a> 
      <a href="#contact">Say hello</a> 
      <a href="Blog">Blog</a> 
     </nav> 
</header> 

있는 style.css

header { 
    height: 50px; 
    background-color: #fff; 
} 

nav { 
    overflow: hidden; 
    text-align: center; 
    padding: 10px; 
    background-color: #fff; 
    position: fixed; 
    top: 0; 
    width: 100%; 

} 

nav a { 
    color: #000000; 
    text-decoration: none; 
    display: inline-block; 
    padding: 15px; 
    border-bottom: 2px solid transparent; 

} 

Answer 1

변경 후 999로 탐색 소자의 Z- 색인하고 위치 추가 1 이미지/섹션

Answer 2

-

는 여기에 내가 지금 가지고있는 코드입니다. 상대 및 Z 인덱스 :

Answer 3

은 탐색 Z위한 Z- 색인 추가 -index : 444/이 하나를 더하기 /;

header { 
 
    height: 50px; 
 
    background-color: #fff; 
 
} 
 

 
nav { 
 
    overflow: hidden; 
 
    text-align: center; 
 
    padding: 10px; 
 
    background-color: #fff; 
 
    position: fixed; 
 
    top: 0; 
 
    width: 100%; 
 
    z-index:444 /*add this one*/; 
 
} 
 

 
nav a { 
 
    color: #000000; 
 
    text-decoration: none; 
 
    display: inline-block; 
 
    padding: 15px; 
 
    border-bottom: 2px solid transparent; 
 

 
}

<header> 
 
     <nav> 
 
      <a href="#logo">Home</a> 
 
      <a href="#whatwedo">What we do</a> 
 
      <a href="#whoweare">Who we are</a> 
 
      <a href="#partners">Who we work with</a> 
 
      <a href="#contact">Say hello</a> 
 
      <a href="Blog">Blog</a> 
 
     </nav> 
 
</header> 
 

 
<div class="cont"> 
 

 
Parturient urna netus a vestibulum justo ridiculus pharetra eros fringilla consectetur volutpat porta varius dolor non risus. Scelerisque dignissim dictum aptent nisl quisque parturient adipiscing laoreet consectetur a vestibulum himenaeos nisl scelerisque a a duis mus scelerisque tempor. Justo ad suspendisse curabitur justo mauris amet ac nec eros quam parturient a viverra habitasse condimentum hac consectetur convallis at curae est nunc primis. Quis auctor adipiscing vestibulum aliquet ornare orci ante a turpis mus odio vehicula laoreet malesuada. Parturient ultrices porta scelerisque vulputate vivamus ut eget malesuada mattis a fusce bibendum ullamcorper condimentum parturient augue sapien eu ridiculus ullamcorper in neque quam ac condimentum parturient sed aptent. Purus nec condimentum vestibulum purus at ut a ultrices natoque fames parturient pulvinar vestibulum in per condimentum rhoncus commodo volutpat primis ante pharetra vitae parturient vestibulum a platea elit. Scelerisque nullam ligula a a lorem ac euismod lectus consequat justo auctor elementum urna adipiscing at parturient erat ut. 
 

 
Ullamcorper suscipit at in fermentum eu parturient primis rhoncus ridiculus at a feugiat sem vestibulum hendrerit magnis consectetur vestibulum erat quisque adipiscing lectus adipiscing ullamcorper a. Montes eget eros euismod ridiculus adipiscing cras suspendisse est potenti fermentum a facilisi purus a a eros suspendisse dui praesent rhoncus sociis et a congue a pulvinar nullam. Magna scelerisque a ullamcorper suscipit blandit hendrerit posuere parturient ridiculus montes fringilla suspendisse tempus et cubilia suspendisse nam consequat curabitur habitant nisi mi. Interdum condimentum ut faucibus parturient vestibulum mattis suspendisse scelerisque aptent enim et nulla leo nam eros feugiat per elit hac sociis non a curae pretium interdum auctor dolor. 
 

 
Id adipiscing donec libero ligula elementum proin condimentum consectetur cursus netus ullamcorper vestibulum purus feugiat a hac nisi at leo ullamcorper condimentum ad mus per eu donec. A nullam condimentum nam condimentum turpis condimentum blandit justo cras dictumst mattis est suscipit consectetur eget augue parturient integer tincidunt a placerat litora. Ullamcorper cubilia vestibulum curabitur potenti rutrum scelerisque cum a per scelerisque sodales blandit malesuada a vestibulum mi sem. Ad suspendisse odio eget sociosqu a a eleifend est consectetur adipiscing suspendisse ultrices ullamcorper montes condimentum adipiscing parturient ullamcorper sem ac sit adipiscing ut. Varius aliquam vestibulum inceptos a a condimentum dictumst montes at phasellus penatibus fermentum a quam diam vestibulum aptent mauris mi a lacinia volutpat justo arcu a a. 
 

 
Nisi porta convallis a etiam a parturient sodales arcu eget malesuada posuere commodo hac enim cras consectetur a pretium imperdiet ridiculus. Vestibulum parturient fermentum et duis rhoncus nisl nostra adipiscing natoque parturient consequat ut a diam turpis libero ridiculus a facilisi tincidunt vitae dis adipiscing hac leo tempus. Scelerisque dapibus parturient justo parturient eget montes euismod adipiscing parturient nec cras mus suspendisse dis id suscipit at suspendisse nisl dictum a pharetra. Placerat aliquet elit scelerisque a phasellus consectetur at eget a nostra mi a enim maecenas integer a. Himenaeos integer malesuada dolor parturient nec aptent urna sociis bibendum a volutpat nascetur a turpis a sodales tempor. Eu potenti lorem blandit quam dapibus elit mus volutpat parturient sociosqu habitasse imperdiet facilisis potenti metus ac adipiscing metus. 
 

 
Quisque a aptent quam non ad a eleifend habitant nam commodo consectetur ut sed suspendisse dolor leo arcu vestibulum iaculis dolor parturient. Ligula praesent scelerisque eu mollis consectetur a vestibulum scelerisque molestie condimentum ut dui ac laoreet egestas malesuada nibh nullam dictumst. Iaculis eu quam a egestas vehicula eu orci id porta purus sodales adipiscing volutpat morbi a ad nunc facilisi a ut litora tempus mauris. 
 

 
Parturient a nisl nec vestibulum vivamus et ullamcorper curae sed pretium faucibus ullamcorper hendrerit per mi adipiscing felis parturient adipiscing fames lobortis adipiscing fermentum at metus dictum potenti ac.Habitant tincidunt ullamcorper imperdiet risus a commodo id litora tempus aliquet vestibulum parturient auctor porttitor condimentum quis gravida donec purus parturient parturient nam class consectetur.Commodo adipiscing. 
 
<div>