隐藏父母而不是菜单中的孩子

Question

我需要一种隐藏父母的方法,<li>但要让孩子<ul>看得见.

例如,我有以下代码:

<li class="toplevel">Link
  <ul>
     <li class="secondlevel">Link</li>
  </ul>
<li>

基本上,我希望类的顶层隐藏,但类secondlevel是可见的.现在我知道我可以用css做到这一点:

visibility:hidden / visibility:visible

但这保持了隐藏类的高度和宽度.我需要使用的更像是:

display:none / display:inline

但是,当然,这不起作用,因为孩子没有表演,并且没有办法让它重新显示它出现.

是否有另一种方法,除了使用可见性隐藏父级,但保留子级,以便没有为隐藏的父级保留高度/宽度？

谢谢.

Answer 1

隐藏parent和显示它是不可能的children.

您可以将要隐藏的顶层链接放置到某个内联标记中:

<li class="toplevel"><span>Link</span>
    <ul>
        <li class="secondlevel">Link</li>
    </ul>
</li>

然后,display:none为此标记设置:

li > span { display: none }