html - Border around tr element doesn't show?

Question

It seems like Chrome/Firefox do not render borders on tr, but it renders the border if the selector is table tr td.

How can I set a border on a tr ?

My try, which doesn't work:

table tr {
  border: 1px solid black;
}

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

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

This is a similar question: Set border to table tr, works in everything except IE 6 & 7 , but it seems to work everywhere except for IE.

Answer 1

将此添加到样式表中：

table {
  border-collapse: collapse;
}

JSF中。

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

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

...以及后来，用于collapse设置：

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