如何从 <td> 建立链接?表格单元格 [英] How can I make a link from a <td> table cell

问题描述

我有以下几点:

一些文字<div>一个div</div></td>

我想让整个 <td>...</td> 成为一个超链接.我宁愿不使用 JavaScript.这可能吗?

解决方案

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

正如已经解释过的，这在语义上是不正确的.a 元素是内联元素，不应用作块级元素.但是，这里有一个适用于大多数浏览器的示例(但 JavaScript 加上 td:hover CSS 样式会更简洁):

<a href="http://example.com"><div style="height:100%;width:100%">你好世界

</a></td>

PS:使用 CSS 作为 在此线程的另一个解决方案中进行了解释.虽然它在 IE6 中不能很好地工作，但这不是新闻 ;)

替代(非建议)解决方案

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

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

I have the following:

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

I'd like to make the entire <td>...</td> a hyperlink. I'd prefer without the use of JavaScript. Is this possible?

解决方案

Yes, that's possible, albeit not literally the <td>, but what's in it. The simple trick is, to make sure that the content extends to the borders of the cell (it won't include the borders itself though).

As already explained, this isn't semantically correct. An a element is an inline element and should not be used as block-level element. However, here's an example (but JavaScript plus a td:hover CSS style will be much neater) that works in most browsers:

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

PS: it's actually neater to change a in a block-level element using CSS as explained in another solution in this thread. it won't work well in IE6 though, but that's no news ;)

Alternative (non-advised) solution

If your world is only Internet Explorer (rare, nowadays), you can violate the HTML standard and write this, it will work as expected, but will be highly frowned upon and be considered ill-advised (you haven't heard this from me). Any other browser than IE will not render the link, but will show the table correctly.

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

这篇关于如何从 <td> 建立链接?表格单元格的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！