如何在Bootstrap 4中移除<thead>与<tfoot>的粗边框

Bootstrap 4 里的表格表头（）默认在使用 .thead-light 或 .thead-dark 类时，会自带2px粗的底部边框，则可能有顶部边框，你可以通过自定义CSS直接覆盖这些默认样式：

• 全局移除所有表格的表头、表尾边框：

/* 移除thead底部边框 */
.table thead th {
  border-bottom: none;
}

/* 移除tfoot顶部边框 */
.table tfoot th,
.table tfoot td {
  border-top: none;
}

• 仅针对特定表格移除边框（推荐，避免影响全局样式）：
  先给目标表格加个自定义类，比如 <table class="table no-header-footer-border">，然后添加CSS：

.no-header-footer-border thead th {
  border-bottom: none;
}

.no-header-footer-border tfoot th,
.no-header-footer-border tfoot td {
  border-top: none;
}

• 如果用了深色表头（.thead-dark），需要单独覆盖它的边框样式：

.table thead.thead-dark th {
  border-bottom: none;
}

要是遇到样式优先级不够的情况，可以给样式规则加上父元素限定，或者临时用 !important 强制覆盖（尽量少用，避免样式冲突）。

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