html - 如何从 表格单元格建立链接

Question

我有以下内容:

<td>
  some text
  <div>a div</div>
</td>

我想制作整个 <td>...</td>一个超链接。我宁愿不使用 JavaScript。这可能吗？

Answer 1

是的，这是可能的，尽管不是字面上的 <td> ，但里面有什么。简单的技巧是确保内容延伸到单元格的边界(尽管它不会包括边界本身)。

如前所述，这在语义上是不正确的。一个a element 是内联元素，不应用作 block 级元素。但是，这里有一个适用于大多数浏览器的示例(但 JavaScript 加上 td:hover CSS 样式会更整洁):

<td>
  <a href="http://example.com">
    <div style="height:100%;width:100%">
      hello world
    </div>
  </a>
</td>

PS:改成a其实更整洁在 block 级元素中使用 CSS 作为 explained in another solution in this thread .虽然它在 IE6 中不能很好地工作，但这不是新闻；)

替代(不建议)解决方案

如果你的世界只有 Internet Explorer(现在很少见)，你可以违反 HTML 标准并编写这个，它会按预期工作，但会被高度反对并被认为是不明智的(你没有听说过这是我的)。 IE 以外的任何其他浏览器都不会呈现链接，但会正确显示表格。

<table>
    <tr>
        <a href="http://example.com"><td  width="200">hello world</td></a>
    </tr>
</table>