如何使用CSS设计元素的后代（不是直接的孩子）？

Question

我试图覆盖使用CSS的元素的后代（不是直接子）的样式。

说，我正在研究：

<table id="z_d__h3-real" class="z-hbox">
 <tbody>
   <tr valign="top">
   -----
   </tr>
  </tbody>
</table>

我想覆盖样式，以将TR元素的元素设置为“中心”。

我尝试做：

table.z-hbox tr {
    vertical-align:center;
}

不过这行不通。我假设table.z-hbox tr正在寻找一个直接的孩子 <tr> 这里不是这种情况。作为 <tr> 被包裹在里面 <tbody>

我该如何解决？

Answer 1

问题不是优先事项。我发现应该是

垂直平衡：中间 而不是垂直空间：中心

这有效。

Answer 2

内联样式的优先级比标签或样式表中的定义更高。要么删除 valign="top" 属性（无论如何，它都以HTML标准的较新版本弃用），或者，如果您无法更改标记，则将CSS规则标记为 !important. 。选择器本身很好（您可以通过添加其他规则来测试此问题）。

Answer 3

您的CSS很好。选择器之间的空格选择后代， > 直接儿童需要。

您的问题是，内联属性优先于样式表中的样式。您可以尝试使用 !important, ，但老实说，我不知道优先级如何与折旧的HTML属性一起使用。我从不使用它们。