HTML 表 CSS？

Question

常见

table tr td
{
    vertical-align:middle;
}

自定义

table.custom tr td
{
    vertical-align:top;
}

当我这样使用时:

<table class="custom">
    <tr>
        <td>
            <table>
                <tr>
                    <td>this text align top, but I want to align middle
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>

子表的行为与其父表相同。怎么能忽略父元素样式呢？

Answer 1

您可以做的一件事是像这样添加子选择器:

table.custom > tr > td { }

那么只有直接的 child 会匹配样式