在项目中修改了el-table表头的背景色之后,发现了一个之前没有注意到的问题,表头每一列之间都出现了一条白色边框,看起来很不美观
![](https://i-blog.csdnimg.cn/blog_migrate/7ca21e0890e38c8bd9837a3723b6f686.jpeg)
查看样式发现table有一个 border-collapse:separate; 属性, border-collapse设置表格的边框是否被合并为一个单一的边框,一共有三个属性值:
![](https://i-blog.csdnimg.cn/blog_migrate/e49d6c4f6196bbc964d7ee9445ece1d2.jpeg)
然后我把 border-collapse的值改为了collapse,也就是合并边框,结果还是不起作用
![](https://i-blog.csdnimg.cn/blog_migrate/8a108e0539e474f59de62b577353cece.jpeg)
后面调整了每一列的距离,发现间隙居然神奇地消失了
修改前的间距设置:
![](https://i-blog.csdnimg.cn/blog_migrate/49cfbbb929b9525b91e12a133845c23a.jpeg)
修改后的间距设置:
![](https://i-blog.csdnimg.cn/blog_migrate/bb629318cc851836923cf81d414dfc2e.jpeg)
但是,在显示设备工具栏的状态下还是能看到间隙,只要关闭设备工具栏就没有了
![](https://i-blog.csdnimg.cn/blog_migrate/34ce6209bd1d48b8d82c96f3f52f50fc.jpeg)