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

Question

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

import org.json4s.jackson.JsonMethods._
val parsed = parse(newData).asInstanceOf[JObject]
parse(newData).asInstanceOf[JObject]

#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;
}

但是当我在Mozilla中打开控制台时，我看到了一部分隐藏的单元格（请参阅表格底部）：

所以我的问题是如何解决？还是建议我其他隐藏表中不必要部分的方法？

P.S。表格单元格是使用javascript创建的

Answer 1

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

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

Answer 2

我认为您看起来像这样：

#workspace {
  width: 800px;
  height: 800px;
  top: 50%;
  left: 50%;
  position: relative;
  overflow-y: hidden;
}
#workspace > table {
  position: absolute;
  width: 820px;
  height: 820px;
  top: -20px;
  left:-20px;
}