html - 将鼠标悬停在父级上时显示元素

Question

我有一个 HTML 表格，我想隐藏一个单元格 (<td>) 的内容，除非鼠标悬停在父行 (<tr>) 上的任何位置。

在悬停时显示元素非常简单，但我不确定如何显示悬停元素之外的另一个元素。

这可以单独使用 CSS 完成吗，还是我需要某种 JavaScript？ (我有可用的 jQuery 和 jQuery UI。)

Answer 1

tr:hover > td {
    display:inline;
}

这是假设您要隐藏的内容是使用 display:none; 隐藏的。只需使用适合您情况的属性即可。

编辑:我将其更改为display:inline，因为在表格的情况下，您可能希望单元格保持相邻而不是上下。

Example .