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

Question

我目前正在处理使用无法修改的 CSS 文件的页面，因此我通常会添加自己的 CSS 来覆盖某些设置。我被困在我想修改 CSS 标签的地方，但只会影响表格中的 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;}