html - Css 悬停链接显示表格

Question

所以我试图在悬停链接时制作一个下拉菜单。链接下方会显示一个表格。我不明白为什么它不起作用。查看 fiddle 链接。

固定链接 http://jsfiddle.net/ThobiasN/Pt3db/

HTML代码示例:

<a class='nav' href='#'>Hover me</a>
<table>
    <tr>
        <td class='dropdown'><p>Show me</p></td>
    </tr>
</table>

CSS 代码示例:

td.dropdown
{
    display:none;
}

a.nav:hover > table
{
    display:block;
}

Answer 1

因为表格不是链接的子项。CSS 中的符号 > 等同于“direct child of”

尝试将表格放在链接内。