How to create simple menu using css

1
In this tutorial i am going to explain about how to create a simple menu using css, In every website important thing is menu bar, we seen different types of menu bars in websites, This is one of the basic menu created using css and html.If you are beginner you try this type of simple menus.
<!DOCTYPE html>
<html>
<head>
<style type=”text/css”>
ul
{
list-style-type:none;
margin:0;
padding:0;
overflow:hidden;
}
li
{
float:left;
}
a:link,a:visited
{
display:block;
width:120px;
font-weight:bold;
color:#FFFFFF;
background-color:#7C1836;
text-align:center;
padding:8px;
text-decoration:none;
text-transform:uppercase;
}
a:hover,a:active
{
background-color:#440D1E;
}
</style>
</head>
<body>
<ul>
<li><a href=”home.html”>Home</a></li>
<li><a href=”about.html”>About</a></li>
<li><a href=”products.html”>Products</a></li>
<li><a href=”gallery.html”>Gallery</a></li>
<li><a href=”contact.html”>Contact Us</a></li>
</ul>
</body>
</html>

Leave a Reply

Your email address will not be published. Required fields are marked *

Close
Your custom text © Copyright 2026. All rights reserved.
Close