tr 元素周围的边框不显示？

Question

似乎 Chrome/Firefox 不会在 tr 上呈现边框，但如果选择器是 table tr td --- ，它会呈现边框。

如何在 tr 上设置边框？

我的尝试，不起作用：

 table tr {
  border: 1px solid black;
}

 <table>
  <tbody>
    <tr>
      <td>
        Text
      </td>
    </tr>
  </tbody>
</table>

http://jsfiddle.net/edi9999/VzPN2/

这是一个类似的问题： Set border to table tr, 适用于除 IE 6 & 7 之外的所有内容，但它似乎适用于除 IE 之外的所有地方。

原文由 edi9999 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

将此添加到样式表中：

 table {
  border-collapse: collapse;
}

JSF 中。

它以这种方式运行的原因实际上在 规范中得到了很好的描述：

在 CSS 中设置表格单元格的边框有两种不同的模型。一种最适用于单个单元格周围的所谓分离边框，另一种适用于从表格一端到另一端连续的边框。

…以及后来，对于 collapse 设置：

在折叠边框模型中，可以指定围绕单元格、行、行组、列和列组的全部或部分的边框。

原文由 raina77ow 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

可以使用 css box-shadow 在 table border collapse separate 模式中模拟边框：

 table tr {
  box-shadow: 0 0 4px #ccc;
}

原文由 Flo Develop 发布，翻译遵循 CC BY-SA 4.0 许可协议