el-table css 表头样式修改

在Element UI的`el-table`组件中，CSS表头样式的修改可以通过覆盖默认样式或者使用自定义样式来实现。以下是一些常见的表头样式调整：

1. **文字样式**：你可以修改`el-table th`或`el-table-column`中的`font-size`, `color`, 或者`text-align`等属性。

.el-table th {
  font-size: 14px;
  color: #333;
  text-align: center;
}

2. **背景色与边框**：可以通过`.el-table th.is-selected`, `.el-table th:hover`等类名设置选中状态、悬停状态下的背景颜色和边框。

.el-table th.is-selected {
  background-color: #f5f7fa;
  border-bottom: 1px solid #e8eaef;
}

3. **单元格宽度**：可以设置`.el-table th`内的内容宽度，例如通过`:not(:last-child)`忽略表头最后一列（通常包含合计行）。

.el-table th:not(:last-child) {
  width: 150px;
}

4. **自定义图标或排序指示**：添加自定义的CSS类来改变表头内箭头的样式或显示其他元素。

.el-table th .sort-caret-down {
  /* 自定义箭头样式 */
}

注意，在修改前最好先备份原文件以防覆盖重要功能的默认样式。此外，为了保证浏览器兼容性和组件的最佳效果，建议将自定义样式放在单独的CSS模块或者 scoped 样式中。