CSS Navigation
2 4812
To create navigation/menus for your website or webpage, please use the advanced CSS navigation code.
This code is very helpful for you :)
<!DOCTYPE html>
<html lang="en">
<head>
<title> CSS Navigation </title>
<style type="text/css">
ul{
list-style:none;
}
ul li{
float:left;
padding:0 5px;
}
ul li a{
padding: 10px;
color: #fff;
text-decoration:none;
font-size:18px;
background-color:#FF9800;
border-radius:5px;
}
ul li a:hover{ background-color:#989796; }
ul li a.active{ background-color:#989796 }
</style>
</head>
<body>
<ul>
<li> <a href="#" class="active"> Home </a> </li>
<li> <a href="#"> About us </a> </li>
<li> <a href="#"> Our Services </a> </li>
<li> <a href="#"> Our Products </a> </li>
<li> <a href="#"> Contact us </a> </li>
</ul>
</body>
</html>
Note: You can change the default color, active navigation color, radius from above CSS code in head section.
Result:
Share:
Comments
Waiting for your comments