这是一款个性又漂亮的CSS3下拉导航菜单展开动画特效，鼠标悬停时二级子菜单有多种炫酷的展开动画效果，代码还简单，需要的朋友赶紧放到自己网站上使用吧。

使用方法

在页面引入以下style.css样式文件

<link rel="stylesheet" href="css/style.css">

HTML代码

<nav>
  <ul class="main">
    <li>
      <a href="#">Home</a>
      <ul class="drop menu1">
        <li><a href="#">Home</a></li>
        <li><a href="#">news</a></li>
        <li><a href="#">contact</a></li>
        <li><a href="#">about</a></li>
      </ul>
    </li>
    <li><a href="#">news</a>
      <ul class="drop menu2">
        <li><a href="#">Home</a></li>
        <li><a href="#">news</a></li>
        <li><a href="#">contact</a></li>
        <li><a href="#">about</a></li>
      </ul>
    </li>
    <li><a href="#">contact</a>
      <ul class="drop menu3">
        <li><a href="#">Home</a></li>
        <li><a href="#">news</a></li>
        <li><a href="#">contact</a></li>
        <li><a href="#">about</a></li>
      </ul>
    </li>
    <li><a href="#">works</a>
      <ul class="drop menu4">
        <li><a href="#">Home</a></li>
        <li><a href="#">news</a></li>
        <li><a href="#">contact</a></li>
        <li><a href="#">about</a></li>
      </ul>
    </li>
    <li><a href="#">team</a>
      <ul class="drop menu5">
        <li><a href="#">Home</a></li>
        <li><a href="#">news</a></li>
        <li><a href="#">contact</a></li>
        <li><a href="#">about</a></li>
      </ul>
    </li>
    <li><a href="#">about</a>
      <ul class="drop menu6">
        <li><a href="#">Home</a></li>
        <li><a href="#">news</a></li>
        <li><a href="#">contact</a></li>
        <li><a href="#">about</a></li>
      </ul>
    </li>
  </ul>
</nav>