HTML+CSS 表格，设置边框麻烦

Question

我正在尝试使用 HTML 表格在线制作数独板并使用 CSS 对其进行格式化。理想情况下，输出看起来像这样的图像:

问题是我无法正确设置边框。下面是单个 3 x 3 框的代码，不幸的是它没有正确输出。类别为“end”的单元格似乎具有非折叠边框。有什么建议么？

HTML:

<table>
 <tr>
    <td><input type='text' size='2' /></td>
    <td><input type='text' size='2' /></td>
    <td><input type='text' size='2' class='end'/></td>
  </tr>
</table>

CSS:

table, td{
    border-color: black;
    border-width: 1px;
    border-style: solid;
}

table{
      border-collapse:collapse;
}

td{
  padding:0px;
  margin: 0px;
}

td .end{
  border-style:solid;
  border-color:black;
  border-width: 1px 3px 1px 1px;
}

input{
  padding:0px;
  margin:0px;
}

Answer 1

您可能希望将类分配给单元格本身，而不是输入字段。