如何隐藏表的指定行的边框？

Question

我想隐藏表格特定行的边框.怎么做？
任何的想法？
示例代码是高度赞赏的.

Answer 1

在您不希望拥有边框的<td>s后面的<tr>s 上使用CSS属性边框.

在我的例子中,我创作了一个课noBorder,我给了一个<tr>.然后我使用一个简单的选择器通过分配使该类的s 内部的tr.noBorder td所有<td>s 的边界消失.<tr>noBorderborder: 0

请注意,px如果您设置了某些内容,则无需提供单位(即),0因为无论如何都无关紧要.零只是零.

table, tr, td {
  border: 3px solid red;
}
tr.noBorder td {
  border: 0;
}

<table>
  <tr>
    <td>A1</td>
    <td>B1</td>
    <td>C1</td>
  </tr>
  <tr class="noBorder">
    <td>A2</td>
    <td>B2</td>
    <td>C2</td>
  </tr>
  <tr>
    <td>A3</td>
    <td>A3</td>
    <td>A3</td>
  </tr>
</table>

这是作为图像的输出:

Answer 2

我使用它有很好的结果:

border-style:hidden;

它也适用于:

border-right-style:hidden; /*if you want to hide just a border on a cell*/

例:

<style type="text/css">
      table, th, td {
       border: 2px solid green;
      }
      tr.hide_right > td, td.hide_right{
        border-right-style:hidden;
      }
      tr.hide_all > td, td.hide_all{
        border-style:hidden;
      }
  }
</style>
<table>
  <tr>
    <td class="hide_right">11</td>
    <td>12</td>
    <td class="hide_all">13</td>
  </tr>
  <tr class="hide_right">
    <td>21</td>
    <td>22</td>
    <td>23</td>
  </tr>
  <tr class="hide_all">
    <td>31</td>
    <td>32</td>
    <td>33</td>
  </tr>
</table>

结果如下: