如何让Bootstrap表格中所有td的边框尺寸保持一致

你的问题出在只给<td>设置了边框，但没统一处理表头<th>，加上border-collapse: collapse合并边框后，未设置边框的单元格会和已设置的单元格形成视觉差。另外滥用!important也可能引发样式冲突，优先去掉不必要的!important，通过选择器权重控制样式更合理。

修正后的CSS代码 #

.table {
  border-collapse: collapse;
}
/* 统一为表头和数据单元格设置边框 */
.table th, .table td {
  border: 1px solid #21ff11;
}

额外检查项 #

• 确认没有其他自定义样式（比如特定td的类）覆盖了边框样式，若有，可使用.table tr td这类更具体的选择器提升优先级
• 如果表格本身设置了边框，要保证其边框宽度和单元格一致，避免合并后出现粗细不一的情况
• 尽量少用!important，它会增加样式调试的复杂度，仅在必须覆盖高优先级样式时再考虑使用

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