html - 表格下拉 {display : table-row;} 不起作用

Question

我正在学习 HTML5、CSS3。我做了一个自我练习：而不是使用 div ul 下拉菜单，尝试使用 table

为什么悬停它不起作用？

http://jsfiddle.net/goldman7911/KQP8Y/

tr:hover {
    display : table-row;
}

问候，

Answer 1

tr {
    display: none;
}
tr: hover {
    display: table-row;
}

这是没有意义的，因为您不能将鼠标悬停在未显示的元素上。相反，您可以table:hover tr作为选择器执行此操作，但这可能需要不同的布局来满足您的需求。