CSS code to make a submenu open when hovering over the main menu item

 <ul> 

  <li> 

    <a href="#">Menu Item 1</a> 

    <ul class="submenu"> 

      <li><a href="#">Submenu Item 1</a></li> 

      <li><a href="#">Submenu Item 2</a></li> 

      <li><a href="#">Submenu Item 3</a></li> 

    </ul> 

  </li> 

  <li> 

    <a href="#">Menu Item 2</a> 

    <ul class="submenu"> 

      <li><a href="#">Submenu Item 1</a></li> 

      <li><a href="#">Submenu Item 2</a></li> 

      <li><a href="#">Submenu Item 3</a></li> 

    </ul> 

  </li> 

</ul>

<style>

ul ul.submenu { 

  display: none; 

}

ul li:hover > ul.submenu { 

  display: block; 

} 

</style>