A navigation bar is a user interface element within a webpage that contains links to other sections of the website. A website navigation bar is most commonly displayed as horizontal list of links at the top of each page.
The navigation bar gives user flexibility to go in different section of website directly from the links present in navigation bar.
HTML Code
<header>
<div class="nav">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">Projects</a>
</ul>
</div>
</header>
Apply CSS in it:
header{
position: sticky;
top: 0;
z-index: 1;
}
.nav {
width: 100vw;
background-color: yellow;
position: relative;
top: 0;
}
ul{
margin: 0px;
padding: 0px;
}
ul li{
list-style-type: none;
float: left;
width: 10rem;
height: 3.5rem;
padding: 1rem;
text-decoration: none;
align-items: center;
}
ul li a{
text-decoration: none;
display: block;
}
ul li a:hover{
color: white;
}
If you want help in HTML/CSS assignments or you want to learn any other things or technology or want help in assignments then please send help request at contact@codersarts.com or fill the form or Chat with website assistant