<!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <meta name="viewport" content="width=device-width, initial-scale=1.0">

     <meta http-equiv="X-UA-Compatible" content="ie=edge">

     <title>submenu</title>

     <style>

         * {

             margin: 0;

             padding: 0;

         }

         ul {

             list-style: none;

         }

         li ul {

             display: none;

         }

         a {

             display: block;

             width: 120px;

             height: 30px;

             line-height: 30px;

             text-align: center;

             text-decoration: none;

             color: black;

             background-color: orange;

             overflow: hidden;

         }

         a:hover {

             background-color: aliceblue;

         }

     </style>

     <script src="js/jquery-1.11.3.min.js"></script>

     <script>

         $(function() {

             $("ul>li").hover(function() {

                 // over

                 $(this).children("ul").show();

             }, function() {

                 // out

                 $(this).children("ul").hide();

             });

         })

     </script>

 </head>

 <body>

     <ul>

         <li>

             <a href="javascript:void(0);">一级菜单1</a>

             <ul>

                 <li>

                     <a href="javascript:void(0);">二级菜单1</a>

                 </li>

                 <li>

                     <a href="javascript:void(0);">二级菜单1</a>

                 </li>

                 <li>

                     <a href="javascript:void(0);">二级菜单1</a>

                 </li>

             </ul>

         </li>

         <li>

             <a href="javascript:void(0);">一级菜单2</a>

             <ul>

                 <li>

                     <a href="javascript:void(0);">二级菜单2</a>

                 </li>

                 <li>

                     <a href="javascript:void(0);">二级菜单2</a>

                 </li>

                 <li>

                     <a href="javascript:void(0);">二级菜单2</a>

                 </li>

             </ul>

         </li>

         <li>

             <a href="javascript:void(0);">一级菜单3</a>

             <ul>

                 <li>

                     <a href="javascript:void(0);">二级菜单3</a>

                 </li>

                 <li>

                     <a href="javascript:void(0);">二级菜单3</a>

                 </li>

                 <li>

                     <a href="javascript:void(0);">二级菜单3</a>

                 </li>

             </ul>

         </li>

     </ul>

 </body>

 </html>

最新文章

  1. Runnable和Thread
  2. BZOJ2120 数颜色（带修改莫队）
  3. dede新建模型中自定义联动类别调用及修改方法
  4. java环境搭建系列：JDK从下载安装到简单使用
  5. Redis持久化-数据丢失及解决
  6. FreeOnTerminate 的线程在线程管理类的Destroy释放时手工释放的问题
  7. 每天进步一点--c#基础巩固,事件、委托
  8. Ext.Array 方法
  9. vs里 .sln和.suo 文件
  10. python 之路，Day11 (下)- sqlalchemy ORM
  11. tool - 支持TestLink 1.93,将excel格式用例转化成可以导入的xml格式
  12. IOS 加载中提示框
  13. Date、DateTime值的格式化扩展函数
  14. 使用Common.Logging与log4net的组件版本兼容问题
  15. lca最近公共祖先（模板）
  16. Java - 路线图
  17. SDN第二次作业
  18. 谷歌SEO初学者常见问题解答
  19. GitHub学习途径
  20. kbmmw 与extjs 的初次结合

热门文章

  1. JAVA:在0-99间产生100个不重复的随机数
  2. 在Vmware安装虚拟机WindowsServer 2003
  3. IO流8 --- 使用FileReader和FileWriter实现文本文件的复制 --- 技术搬运工（尚硅谷）
  4. 加载selenium2Library失败---robotframework环境搭建（site-packages下无selenium2library文件夹）
  5. vmstat-虚拟内存查看实例
  6. Leetcode11.Container With Most Water盛最多水的容器
  7. 【扩展推荐】Laravel-ide-helper 高效的 IDE 智能提示插件 | Laravel China 社区 - 高品质的 Laravel 和 PHP 开发者社区 - Powered by PHPH
  8. 将Factory-boy生成的复杂对象转成dict的方法
  9. 在MaxCompute中利用bitmap进行数据处理
  10. 创建多个Django业务模块