包含另一个表的 td 的不同 CSS [关闭]答案

【问题标题】：Different CSS for td which contains another table [closed]包含另一个表的 td 的不同 CSS [关闭]
【发布时间】：2014-12-10 18:15:21
【问题描述】：

我有一个 html 表格内的 html 表格。我想为单独包含子表的特定 td 应用不同的 CSS 样式（填充和边距）。

我想要padding: 5px; 用于除包含子表的所有 td。由于表格是动态生成的，我无法明确将样式赋予 td。有时父表会有子表，有时没有。我用 jQuery 尝试过同样的方法，但无法解决问题。

父表是作为 GridView (asp.net) 的一部分生成的，并且正在使用 EmptyDataTemplate 创建一个与 GridView 相似的子表，用于在不存在数据时插入值。

请帮我解决这个问题。

【问题讨论】：

【解决方案1】：

See this example I made:

td table {
    margin: -5px;
}

诀窍是给第二个表一个负边距以抵消它周围的填充。

【讨论】：

【解决方案2】：

你可以在 jquery 中做这样的事情：

$("td").not($(this).find("table")).css("padding","5px");

这将为所有没有子表的 td 添加填充。您也可以通过添加类而不是内联样式来做到这一点。

【讨论】：

【解决方案3】：

你可能想看看 css 选择器 link

虽然你描述的不是 CSS 的一部分，但我猜 link

如果您可以在带有子表 sub 的表 td 上使用 JQuery：$('table td:has(table.sub)').addClass('has_sub');

然后设置td.has_sub的样式

【讨论】：

【解决方案4】：

用下面这样的东西来定位它

CSS

 .the-class {
enter code here

}

jQuery

$("td:has(table)").addClass("the-class");

注意：我更喜欢 addClass 方法，因为 .css 会在您的 html 中添加内联 css。

【讨论】：

【解决方案5】：

通常，您要查找的选择器是“>”，它指向一个子元素，而不是孙子元素。示例：

parent-selector > direct-child-selector {
}

对于表格虽然有点棘手，因为 html 会自动插入 tbody，所以您需要的是：

table-selector > tbody > tr > td {
}

【讨论】：