Question

我有课程定义：

.small, td.small, td.small > nobr, td.small > a
{
    font-size: 90%;
}

目的是使文字更小。这应该适用于任何事情：锚中的文本，单元格中的文本等。

但实际上，如果锚在单元格内部，则样式应用为TWICE：

<table>
    <tbody>
        <tr>
            <td class="small">
                <a href="...">VERY small content</a>
            </td>
            <td class="small">Smaller text - looks as required</td>
        </tr>
    </tbody>
</table>

为什么呢？如何确保样式只应用一次？

谢谢。

Answer 1

只需移除样式的最后一部分td.small > a即可。然后它将应用于<td>内的所有内容。请注意，我将字体大小更改为60％，以便更改大小。

.small, td.small, td.small > nobr
{
    font-size: 60%;
}

<table>
    <tbody>
        <tr>
            <td class="small">
                <a href="...">Small content</a>
            </td>
            <td class="small">Should be smaller as well</td>
        </tr>
    </tbody>
</table>

为什么样式应用两次？

1 个答案: