如何使用填充颜色覆盖 html td？

Question

我希望将单元格 d 设为全黄色背景。

我该怎么做？

我的目标是 Outlook 显示中的 html。

http://jsfiddle.net/f2pb227a/

更新1：实际上，我正在使用agility html pack在运行时更改单元格d，并且表格已经格式化良好，由于某些原因，我只想在最后一步更改单元格d，因此，我想使用div插入黄色背景而不更改它的父 td 类。

最终解决方案：https://jsfiddle.net/0khjqdh0/

<table class="XXX" >
    <tr class="header">
        <td>Col 1</td>
        <td>Col 2</td>
    </tr>
    <tr class="d1">
        <td>a</td>
        <td>b</td>
    </tr>
    <tr class="d0">
        <td>c
        </td>
        <td> 
            <div class="special_class"> d </div>
        </td>
    </tr>
</table>



.XXX table{
    border:0px;
    border-collapse:collapse;
    padding:0px;
}

.XXX tr.header td {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10.0pt;
    font-weight: bold;
    border:1px solid #C0C0C0;
    color:#FFFFFF;
    background-color:#4F81BD;
    border-collapse:collapse;
    padding:5px;
}
.XXX tr.d0 td {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10.0pt;
    background-color:#E1EEF4;
    border:1px solid #C0C0C0;
    padding:5px;
    white-space:nowrap;
}

.XXX tr.d1 td {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10.0pt;
    background-color:#FFFFFF;
    border:1px solid #C0C0C0;
    padding:5px;
    white-space:nowrap;
}

.XXX div.special_class {
background-color:yellow;
}

Answer 1

朋友，请检查这个 - http://jsfiddle.net/afelixj/f2pb227a/4/

.XXX div.special_class {
  background-color:yellow;
  padding: 5px;
  margin: -5px;
}

Answer 2

您可以将课程放在单元格上：

<td class="special_class">
  <div> d </div>
</td>

然后在单元格上设置样式并使其足够具体以覆盖现有样式：

.XXX tr.d0 td.special_class {
    background-color:yellow;
}

演示：http://jsfiddle.net/f2pb227a/1/

Answer 3

尝试将

background-color:yellow;

应用于父 td 或从 td 单元格中删除填充并将该填充赋予子 div

Answer 4

您只需要不给

td

的子元素指定类，而是给

td

想要更改的背景颜色：

<td class="special_class">

Answer 5

尝试这样申请

td:has(> .specialclass) {  background-color: yellow; }