表格就像一个链接
我无法将我的表格行设置为链接。 我只能使用CSS和HTML。 我尝试了不同的东西从行到另一个东西,但仍然无法使其工作。
你有两种方法可以做到这一点:
使用javascript:
<tr onclick="document.location = 'links.html';">
使用锚点:
<tr><td><a href="">text</a></td><td><a href="">text</a></td></tr>
我使用了第二部作品:
table tr td a {
display:block;
height:100%;
width:100%;
}
为了摆脱列之间的死亡空间:
table tr td {
padding-left: 0;
padding-right: 0;
}
以下是第二个示例的简单演示: DEMO
我让自己定制了一个jquery函数:
HTML
<tr data-href="site.com/whatever">
jQuery的
$('tr[data-href]').on("click", function() {
document.location = $(this).data('href');
});
对我来说简单而完美。 希望它可以帮助你。
(我知道OP只需要CSS和HTML,但考虑jQuery)
编辑
同意Matt Kantor使用数据attr。 上面编辑的答案
如果您在支持它的浏览器上,则可以使用CSS将<a>
转换为表格行:
.table-row { display: table-row; }
.table-cell { display: table-cell; }
<div style="display: table;">
<a href="..." class="table-row">
<span class="table-cell">This is a TD... ish...</span>
</a>
</div>
当然,你只限于不把块元素放在<a>
。 你也不能将它与普通的<table>
混合使用