Dropdown Menu in Css and Html

DROPDOWN MENU IN CSS AND HTML


HTML



<ul id="menu">
                <li><a href="#">Mobile</a>
              
                    <ul class="submenu">
                  
                    <li><a href="#">sony</a></li>
                    <li><a href="#">apple</a></li>
                    <li><a href="#">micromax</a></li>
                    </ul>
              
                    </li>
                <li class="tablet"><a href="#">tablet</a></li>
              
              
                <li class="accessries"><a href="#">accessries</a></li>
                
                
</ul>



CSS


ul#menu,ul#menu ul.submenu{
margin:0;
padding:0;
}

ul#menu li,ul#menu ul.submenu li
{
list-style-type:none;
display:inline-block;
}
ul#menu li a,ul#menu ul.submenu li a{

text-decoration:none;
color:#666;
background:#fff;
display:inline-block;
padding:5px;

}
ul#menu li{
position:relative;
}
ul#menu li ul.submenu{
display:none;
position:absolute;
top:30px;
left:0px;
}
ul#menu li:hover ul.submenu{

display:block;
}






Comments

Popular posts from this blog

Create New Project in Laravel

How to Get Access of Database of Dynamic Site Without cPanel Details

How to Create Secondary Menu in Squarespace