Thursday, 19 March 2015

Dropdown Navigation Menu Using HTML and CSS


This is the HTML code, just copy and paste this code to get the drop down menu

CSS Code
* 
{
 margin:auto;
}

.nav 
{ 
 width:1000px;
    height:30px;
 padding:0px; 
 background-color: #663300;

}

.nav ul
{ 
 padding:0px; 
 margin:0px; 
 line-height:30px;
}

.nav li
{   
 list-style:none;
    float:left; 
    position:relative;
}

.nav a 
{ 
 width:130px;
    height:30px;
 text-decoration:none;
 display:inline-block;
 text-align:center;
 background-color: #663300;
 color:#000;
 margin-left:20px;
 border-radius: 0px 0px 10px 10px;
}
.nav ul ul
{ 
 position:absolute; 
 visibility:hidden 
}

.nav li:hover ul
{ 
 visibility:visible;
}
.nav a:hover 
{
 background-color: #66FF00;
}     
       

0 comments:

Post a Comment