Css hover drop down menu to show menu option - HTML CSS CSS Widget

HTML CSS examples for CSS Widget:Menu Dropdown

  1. HOME
  2. HTML CSS
  3. CSS Widget
  4. Menu Dropdown

Description

Css hover drop down menu to show menu option

Demo Code

ResultView the demo in separate window 

<html>
 <head> 
  <style type="text/css">
nav ul ul {
   display:none;
}

nav ul li:hover>ul {
   display:block;
}

ul {<!--   w  ww  .j  av a  2s.  co  m-->
   list-style:none;
}
</style> 
 </head> 
 <body> 
  <nav> 
   <ul> 
    <li> 
     <div class="settingsIcon"></div> 
     <div class="text">
       Lorem ipsum dolor 
     </div> 
     <div class="downArrowIcon"></div> 
     <ul> 
      <li>Lorem ipsum do</li> 
      <li>Lorem ipsum dol</li> 
      <li>Lorem ipsum </li> 
      <li>Lorem </li> 
     </ul> </li> 
   </ul> 
  </nav>  
 </body>
</html>

Related Tutorials