应用 CSS 格式以仅在 TD 级别覆盖它

Question

我目前正在处理使用无法修改的 CSS 文件的页面，因此我通常会添加自己的 CSS 来覆盖某些设置。我被困在我想修改 CSS 标签的地方，但只影响 table 中的 TD，而不影响其他任何地方。

这是 CSS 文件中我无法修改的标签：

.medtext { font-size: 10pt; } 
.medtext { color: #000000; }

而我想做的是如果这个标签被用在TD中来改变背景颜色：

table.medtext td {background-color:#ffc477!important}

这是HTML:

<span class='medtext'>Some Text that should not be affected</span>

<table><tr>
<td class='medtext'>The background color should change here</td>
<td class='medtext'>here too!</td>
</tr></table>

Answer 1

您的正确代码应该是

    span.medtext {color:#eee! important;}
td:nth-child(1).medtext {color:red! important;}
td:nth-child(2).medtext {color:orange! important;}

应用 CSS 格式以仅在 TD 级别覆盖它

Apply CSS formatting to override it only at TD level

css

overriding

html-table