html - 如何设置表格每一行的特定列的样式以不显示其边框

Question

这是我的 table

<table  border ="1" width="1253" style="margin-left:30px;">
      <tr>
        <td width="40" height="40"></td>
        <td width="5" height="40"></td>
        <td width="30" height="40"></td>
      </tr>
      <tr>
        <td width="40" height="40"></td>
        <td width="5" height="40"></td>
        <td width="30" height="40"></td>
      </tr>
      <tr>
        <td width="40" height="40"></td>
        <td width="5" height="40"></td>
        <td width="30" eight="40"></td>
      </tr>
      <tr>
        <td width="40" height="40"></td>
        <td width="5" height="40"></td>
        <td width="30" height="40"></td>
      </tr>
      <tr>
        <td width="40" height="40"></td>
        <td width="5" height="40"></td>
        <td width="30" height="40"></td>
      </tr>
    </table>

这是我的CSS

 table {
    border-collapse: collapse;
    border-style: hidden;
}

table td, table th {
    border: 1px solid #0082C1;
}

这样做我可以显示没有任何外边框的表格，但我想让它看起来像两个表格，这意味着每行的中间列不应该显示。请帮助我。我已经尝试通过使用属性 display:inline-block 在一行中使用两个表，但它没有正常工作，因为它还显示了外边框。

Answer 1

fiddle

尝试:

//remove borders on second column

    table tr td:nth-child(2) 
    { 
    border:none; 
    }

//remove left and right borders

table td, table th {
    border-top: 1px solid #0082C1;
    border-left:none;
    border-right:none;
}