我在超链接中有一个表格：
<a href="/"><table><tr><td>...</td></tr></table></a>
在所有浏览器中，将鼠标悬停在表格上会将指针变为手形，并且通过一些 CSS 表格背景会改变颜色（因此看起来“突出显示”）。
但是，在 Internet Explorer 中，单击表格无效。在 Firefox 和 Chrome 中，它按预期遵循超链接。
如何让 IE 在点击时跟随链接？
【问题讨论】：
标签： html internet-explorer hyperlink html-table
您不能将块级元素嵌套在内联元素中并期望得到正确的结果（在此处插入引用）。
您可以在表格中添加一些 CSS 样式并应用 onclick 处理程序，使其像超链接一样发挥作用：
<table style="fakeLink" onclick="window.location = '/';">...
还有fakeLink 类：
.fakeLink
{
color: blue;
border-color: blue;
cursor: pointer;
text-decoration: underline; /* Not sure if this is possible. */
}
和演示这两种技术的演示：http://jsfiddle.net/qNGrp/4/。我没有 IE，但我认为只有一个可以正常工作。
【讨论】：
<head>，没有<body>，没有<li>s的结束标签。这很令人不安......
<nav> 和 <aside> 之类的也很棒，因为您将 CSS 应用于它们并且仍然具有 CSS ID 选择器的特异性。
<div> 嵌套习惯！
首先：在块级元素周围放置<a> 在 HTML5 中是有效的！在http://validator.w3.org/查看下面的代码
第二：任何 JavaScript 变通方法都会降低可访问性，因此这不是最好的做法 ;-)
我的解决方案：使用<div> 代替<table> - 如下所示：
<!DOCTYPE html>
<html>
<head>
<title>MSIE sucks!</title>
</head>
<body>
<a href="javascript:alert('Yeah!')">
<table>
<tr>
<td><table> Doesn't work in Internet Explorer 8 :-(</td>
</tr>
</table>
<div style="display:table">
<div style="display:table-row">
<div style="display:table-cell">Solution: <div style="display:table"></div>
</div>
</div>
</a>
</body>
</html>
【讨论】：
我已经设法为此找到了解决方案，它并不完美，但它确实有效：
a{ display:inline-block; position:relative; }
a:after{ content:''; position:absolute; top:0; left:0; width:100%; height:100%; background:url('x'); }
<a href='http://dropthebit.com' target='_blank'>
<table>
<tr>
<td>cell 1</td>
<td>cell 2</td>
<td>cell 3</td>
</tr>
</table>
</a>
【讨论】：
它不应该工作。 IE 在那里有正确的行为。表是块级元素；链接是内联元素。内联元素不能包含块级元素。
如果你想点击你的元素来改变页面，你可能需要Javascript。不过，更改 CSS 应该不难：:hover 伪选择器仍然适用于 table 元素。
【讨论】：