悬停时显示表格行大纲

我试图在悬停时突出显示表格行的边框。不幸的是，这仅适用于第一行单元格。较低的行有一个不改变颜色的边框。我尝试过使用outline但它不太适合:hover在网络套件中。

http://jsfiddle.net/S9pkM/2/ http://jsfiddle.net/S9pkM/2/

想象一下您的标准表格 html。一些 tr 和一些 td。将鼠标悬停在一行上应以红色突出显示其边框。

table { border-collapse: collapse; } /*I am aware of separate */
table td { border: 3px solid black; }
table tr:hover td { border-top-color: red; border-bottom-color: red; }
table tr:hover td:first-child { border-left-color: red; }
table tr:hover td:last-child  { border-right-color: red; }

我愿意接受其他方法，但我坚持使用表结构。除了标准之外，不插入额外的 html<table> <tr> <td>

我一直面临同样的问题，终于找到了一个更简单的解决方案here https://stackoverflow.com/a/7942229/114029.

你可以使用这个 CSS 技巧（border-style: double;) 适用于 1px 边框：

#mytable tr.row:hover td
{
    border-style: double;
    border-color: red;
}

这将使您的border-color无论如何，工作（成为最重要的）。 :-)