如何通过CSS使第二个表格边框样式与第一个表格一致？

要让第二个表格的边框和第一个用原生border属性的表格完全一致，你需要还原浏览器对border="1"表格的默认样式，对应的CSS代码如下：

/* 匹配原生border="1"的表格边框样式 */
.table-native-border {
  /* 合并表格边框，避免单元格间出现双边框 */
  border-collapse: collapse;
  /* 表格本身的边框 */
  border: 1px solid black;
}

/* 为表格内的单元格设置边框 */
.table-native-border th,
.table-native-border td {
  border: 1px solid black;
}

将第二个表格的class属性设置为table-native-border即可。

补充细节 #

原生border="1"的表格默认会给单元格添加少量内边距（不同浏览器略有差异，比如Chrome默认是padding: 1px 2px），如果需要做到100%视觉一致，可以在单元格的CSS规则里加上：

padding: 1px 2px;

内容的提问来源于stack exchange，提问作者DCR