Question

这是html：

<table>
    <thead>
        <th><a href="...">Number</a></th>
        <th><a href="...">Description</a></th>
    </thead>
    <tbody>
        <td><a href="...">1234</a></td>
        <td>... description</td>
    </tbody>
</table>

现在，当我想要向td的table a { display: block; padding: 5px; }添加相同的填充时，向table td { padding: 5px; }添加填充会导致问题。也许我已经过度使用了填充物？

我通过以下几种方式解决了这个问题：<th><a href="...">1234</a></th>然后css只适用于元素，而不适用于td。我还添加了class="nolink"，但我觉得这种方法比使用描述其内容的类更具语义性。

这一切都来自CSS（我熟悉）中的问题，没有办法说明，所有td的单向样式除非锚是后代。我注意到CSS3中的:not选择器，但我不确定在这种情况下我是否理解如何使用它？

更新：问题实际上是将填充添加两次到带有锚标记的单元格

我没有很好地解释实际问题，请看：

http://cssdesk.com/VCtfN

将鼠标悬停在链接上时会注意到填充。

Answer 1

A标记是内联元素。如果要使用边距和填充，请使用display:block。

table a { padding: 5px; display:block }

Answer 2

我看到了这个问题的两个解决方案：

将填充添加到td和th，但不添加到a。 Demo
使用5px padding封装所有无锚内容和一些块元素，并从td / th中删除所有填充。 Demo

在表中使用填充编写以块显示的锚点的语义正确方法是什么？

2 个答案: