Javascript 如何通过悬停显示/消失将第三级添加到我的css菜单

我正在努力为我的菜单添加第三级css。我成功地在我的下拉菜单上创建了第三个关卡，但悬停时出现/消失的效果没有显示出来

   <pre> <style type="text/css">
*                   { margin: 0; padding: 0; }
body                { font: 15px Helvetica, Sans-Serif; } 
html                { overflow-y: scroll; }
p                   { margin: 0 0 0 0; }
a                   { text-decoration: none; }
img                 { vertical-align: middle; }
ul                  { list-style: none;}


/* 
  LEVEL ONE
*/
ul.dropdown                         { position: relative; width: 100%; z-index: 5000;}
ul.dropdown li                      { font-weight: bold; float: left;margin-left: 0; width: 160px; background: #7C73AF; position: relative;list-style: none;}
ul.dropdown a:hover                 { color: white;position: relative; }
ul.dropdown li a                    { display: block; padding: 3px 8px; color: white; position: relative; z-index: 2000; }
ul.dropdown li a:hover,
ul.dropdown li a.hover              { background: #552588; position: relative;  }


/* 
  LEVEL TWO
*/
ul.dropdown ul                      { display: none; position: absolute; top: 0; left: 0; width: 180px; z-index: 1000; }
ul.dropdown ul li                   { font-weight: normal; background: #f6f6f6; color: #000; border-bottom: 1px solid #ccc;list-style: none; }
ul.dropdown ul li a                 { display: block; background: #A39ABF !important; } 
ul.dropdown ul li a:hover           { display: block; background: #552588 !important; color: white}

ul.sub_menu                         {margin-left: -12px;} 

/* 
    LEVEL THREE
*/
ul.dropdown ul.sub_menu ul                  { left: 100%; top: 0; }
ul.sub_menu  li:hover > ul      { visibility: visible; width: 12em;
height: auto;
float: left;}


ul.sub_menu2                        {margin-left: -12px;}

</style>
<code>

下面是显示菜单的jsp：

---

我做错了什么

您正在使用

显示：无

隐藏ul，但尝试使用

可见性：可见

ul.dropdown  ul > li > ul {
    display:none;
}
ul.dropdown  ul > li:hover > ul  {
    display:block;
}

或

---

你加小提琴是什么意思？在给定的链接中粘贴你的代码。如果它是故意的，或者我不知道如何使用它，它似乎并不能解决我的问题。仍然没有解决我的问题：(

ul.dropdown  ul > li > ul {
    visibility:hidden;
}
ul.dropdown  ul > li:hover > ul  {
    visibility:visible;
}

ul.dropdown  ul > li > ul {
    display:none;
}
ul.dropdown  ul > li:hover > ul  {
    display:block;
}