css - css 选择器 :empty for tr td 不起作用

Question

我在这里查看了一些文章，但在我的情况下我没有得到任何答案。我需要空内容 td 不显示 bg-color，并且我有 css ：empty，但它不起作用。

此处的示例代码：http: //codepen.io/bard/pen/aDKiv

谢谢专家。

Answer 1

它不起作用，因为您的 TD 本身有一个空白区域。不要让 ' ' 出现在 TD 中，因为 ' ' 不满足 :empty 的条件

并更改以下内容

#wp-calendar tr td:empty {
    background:none !important;
}

Answer 2

您可以按如下方式实现：

#wp-calendar tr td.pad:not(:empty) {
    border:none !important;
    background-color: rgba(255,255,255,0.04);
}

如果你想在空的情况下应用一些样式。尝试以下：

#wp-calendar tr td.pad:(:empty) {
   /* some style */
}

Answer 3

无论如何，您都需要删除 s，因为它们被视为非空文本内容。为了使空单元格不可见，您还可以使用empty-cells: hide表格元素。它比:empty伪类具有更好的浏览器支持，并且可能更通用，因为它将仅包含空格字符（常规空格、换行符、制表符等）:empty的单元格视为空，同时要求元素完全不包含任何内容（包括空格）个字符）被认为是空的。

请参阅编辑的示例：http ://codepen.io/SelenIT/pen/xEpDn

Answer 4

用这个。这是工作。

table tr td:empty::after { 
    position: relative;
    content: " ";
    visibility: hidden;
}