html - 如何使用 CSS 取消隐藏表格的一行？

Question

我在 tbody 中有一个 table 元素和几个 tr 元素。tr 元素(行)之一默认使用 display:none 隐藏，我不使用 visibility:hidden 函数，因为留下的空间不会以这种方式折叠。到目前为止它有效，现在我想要的是让行重新出现在一个 Action 的条件下，例如 :hover 或 :active 使用 CSS。当我根据这样的操作更改行的显示条件时，行确实展开了，但是，它只显示空白。当我更改 tr 元素内 (td div div) 的宽度时，该行的单元格会重新出现，因为这些单元格的宽度在使用 display:none 后等于零。我似乎无法使用 CSS 更改以 Action 为条件的单元格的宽度(例如，我可以更改此元素的背景颜色)。所以我的问题是，我该如何解决这个问题？我只能使用 HTML 或 CSS。

Answer 1

:hover 或 :active 不是 Action 而是状态，或者准确地说是伪类。并且由于您使元素不通过 display:none 显示，因此它们不能悬停(您不能悬停不存在的东西)或激活(除非您通过 JS 等激活它)。您可以玩弄的是通过悬停父项使子项可见，但它被认为是一种相当肮脏的解决方案，并且不太可能达到预期的效果，因为它不会像我猜您正在尝试做的那样改变 DOM。