隐藏HTML表格中的单元格边框

Question

我想删除HTML表格的单元格边框，但保留＆＃34;外部＆＃34;边界。

这样的默认HTML表格将如下创建：

但我想要这样的布局：

我该怎么做？

Answer 1

唯一的方法是通过CSS。 将所有边框重置为0 px然后使用不同的类重置它可以覆盖它并仅在特定单元格上显示所需的边框

table {
border: 0px;
}
.bottom {
border-bottom: 1px solid black;
}
.left {
border-left: 1px solid black
}
....

等等

Answer 2

您可以使用css来实现这一目标。请查看以下代码

<table width="300" border="0" cellpadding="0" cellspacing="0" class="border" >
<thead>
 <tr>
  <td class="border-head">&nbsp;</td>
  <td class="border-head">&nbsp;</td>
  <td class="border-head" >&nbsp;</td>
 </tr>
</thead>
<tr>
 <td>&nbsp;</td>
 <td>&nbsp;</td>
 <td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>

并使用css之类的

<style>
 .border {
   border:solid 1px #000;
 }
.border-head {
 border-bottom:solid 1px #000;
 }
</style>

你可以在js fiddle here

中看到这个动作