html - 如何隐藏表格边缘的行和列？

Question

例如，我有一张 82x82 的 table 。但我只想显示表格的中央 80x80 部分。隐藏的表格单元格仍然会有一些数据，我只是不想显示它们。我的想法是将表格放入一个 div 中，以隐藏表格中不必要的部分。像这样:

#workspace {
  position: absolute;
  width: 800px;
  height: 800px;
  top: 50%;
  left: 50%;
  margin-left: -400px;
  margin-top: -400px;
  overflow: hidden;
}

table {
  position: absolute;
  margin-left: -10px;
  margin-top: -10px;
  width: 820px;
  height: 820px;
}

<div id="workspace">
  <table>

  </table>
</div>

但是当我在 Mozilla 中打开控制台时，我看到了一部分隐藏的单元格(见表底部):

所以我的问题是如何解决这个问题？或者建议我使用其他方法来隐藏表格中不需要的部分？

附言表格单元格是用 javascript 创建的

Answer 1

使用 nth-child() 选择器获取和隐藏边缘的表格元素。

 tr:first-child,
 tr:last-child,
 td:first-child,
 td:last-child {
   display: none
 }