html/css下拉菜单未删除

Question

编辑JSfiddle

---

简单的问题是，我有以下代码，但我不知道该向css添加什么来提升显示：none；如果你需要进一步的解释，请随时在评论中询问。

<nav>
        <ul>
            <li>
               <a href="[[~[[+id]]]]" title="[[+pagetitle]]">
                 [[+longtitle:default=`[[+pagetitle]]`]] 
               </a>
               <ul>
                  <li>
                     <a href="#" title=lorem>
                        [[Wayfinder? &startId=`[[+id]]` &level=`2` ]]
                     </a>
                  </li>
               </ul>
            </li>
        </ul>
    </nav>

---

/** Navigation **/
#nav ul{list-style: none; padding: 0; display: block;}
#nav ul li{display: inline-block; position: relative;}
#nav ul li a{ display: block; padding: 5px 8px; text-decoration: none; font-size: 16px; }
#nav ul li ul{
    position: absolute;
    left: 0px;
    background: rgba(0,0,0,0.8);
    border-radius: 0 0 5px 5px;
    display: none;
    z-index: 9000;
    display:none;
}
.ie7 #nav ul li ul,
.ie8 #nav ul li ul{
    background: url('../../assets/img/transparent-black.png') repeat;
}
#nav ul li.last ul{ right: 0px; left: auto; }
#nav ul li.last ul li a{ text-align: right; }
#nav ul li:hover ul,
#nav ul li ul:hover{ display: block; }
#nav ul li ul li{
    display: block;
    padding: 0;
    overflow: hidden;       
}
#nav ul li ul li a{
    min-width: 100px;
    margin: 0;
    padding: 7px 14px;
    color: #ffffff;
}
#nav ul li ul li:hover{ background: #f1f1f1; }
#nav ul li ul li a:hover{ color: rgba(253,183,46,1); }

nav li:hover > nav li ul li{
    background-color:red;
    overflow:visible;
}
nav li ul li{
    display:none;
}

Answer 1

试试这个：

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

http://jsfiddle.net/vpZ5J/4/

Answer 2

您试图隐藏子菜单中的li项。相反，隐藏子菜单ul，然后在悬停时显示它。对于这一变化，

nav li ul li{
    display:none;
}

至

nav li ul{
    display:none;
}

并添加此

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

DEMO

Answer 3

尝试添加以下内容：

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

jsfiddle

Answer 4

添加以下规则：

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

http://jsfiddle.net/vpZ5J/

Answer 5

我想你要找的是：

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

此外，您没有id为#nav的div，所以您所有的样式都是不正确的，您应该只使用nav