html - 相当于 td:empty 的内联 CSS

Question

是否有任何与 CSS 选择器等效的内联 CSS：

table td:empty {
  visibility: hidden;
}

我应该为此写什么？

<table style="???">
  <tr>
    <td></td> <!-- to be filled later -->
    <td>foo</td>
  </tr>
</table>

Answer 1

我不这么认为，因为您在样式标签中放置的是样式代码，而不是选择器...您的元素会自行选择，如果您将内联样式代码放在 HTML 中，那么您应该知道您在哪里放置它。

否则，您应该使用 CSS 样式表和选择器。

Answer 2

Bardo 的回答通常是正确的：您不能在内联style属性中指定选择器，因为它只接受适用于具有该属性的元素的样式声明（尽管有继承）。有关更多详细信息以及对规范的参考，请参阅我对这个问题的回答。

但是，在您隐藏空单元格的非常具体的情况下，表格元素实际上恰好支持可能执行您正在寻找的empty-cells属性的属性：

<table style="empty-cells: hide">
  <tr>
    <td></td> <!-- to be filled later -->
    <td>foo</td>
  </tr>
</table>

请注意，propdef 表示它适用于表格单元格而不是表格元素，但是该属性是继承的，因此您可以在表格本身上指定它并通过继承将其应用于其所有空单元格。