Hello friends, welcome to our new post thie post contains the source code of horizontal navigation bar created with only html and css. you can watch our video to see how it looks like and also you can subscribe our channel for more cool projects
SOURCE CODE
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Navigation Bar</title>
<style>
ul {
height:60px;
background-color: Black;
list-style: none;
margin:0px 0px;
padding:0px;
line-height: 60px;
font-size: 20px;
}
li{
float:left;
}
ul li a{
display: block;
color:white;
padding:0px 20px;
text-decoration: none;
}
a:hover, #home {
background-color: #ff0000;
}
</style>
</head>
<body>
<div >
<ul>
<li><a href="#" id ="home">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Products</a></li>
<li><a href="#">Contact Us</a></li>
</ul>
</div>
</body>
</html>
Post a Comment