为什么 HTML 元素会从未指定的类继承 CSS？ [复制]

Question

我是 Web 开发的业余爱好者，但在正确设置页面样式时遇到了问题。我的元素<th> 和<td> 的样式由.lookup_result th, td {} 而不是.form_output . entry_cache th, td {}。如果我期望 <th> 和 <td> 元素仅从其“父”类而不是与我的条目无关的类中获取样式，我是否理解错误？

我的 HTML：

<div class="form_output">
    <table class="entry_cache">
        <th>
            Header
        </th>
        <td>
            Data
        </td>
    </table
</div>

我的 CSS：

.form_output .entry_cache th, td {
    width: 10em;
    text-align: left;
}

.lookup_result th, td {
    width: 7em;
    text-align: right;
}

Answer 1

您需要为两个标签添加层次结构，否则您将其应用于每个td。

.form_output .entry_cache th, 
.form_output .entry_cache td {
    width: 10em;
    text-align: left;
}

.lookup_result th,
.lookup_result td {
    width: 7em;
    text-align: right;
}