重写火狐浏览器下el-table滚动条样式

要在火狐浏览器(Firefox)下自定义Element UI (Vue中的表格组件el-table)的滚动条样式，你需要通过CSS来覆盖默认样式。因为浏览器对滚动条的样式控制有限，尤其像Firefox这样的默认滚动条通常不可直接修改，但可以尝试使用一些技巧，比如利用伪元素`::-webkit-scrollbar`（针对Webkit内核，包括Chrome和Safari）或`::-moz-scrollbar`（Firefox的专属）来改变外观。

首先，在你的CSS文件中创建一个新的类，例如`.custom-scrollbar`：

.custom-scrollbar {
  overflow-y: auto;
  -ms-overflow-style: none; /* IE 和 Edge */
}

.custom-scrollbar::-webkit-scrollbar {
  width: 8px; /* 滚动条宽度 */
}

.custom-scrollbar::-webkit-scrollbar-track {
  background-color: rgba(0, 0, 0, 0.1); /* 轨道颜色 */
}

.custom-scrollbar::-webkit-scrollbar-thumb {
  background-color: #6c757d; /* 滚动块颜色 */
  border-radius: 4px;
}

/* Firefox 特有的滚动条样式 */
.custom-scrollbar:-moz-scrollbar {
  width: 8px;
}

.custom-scrollbar:-moz-scrollbar-thumb {
  background-color: #6c757d;
  border-radius: 4px;
}

然后，将这个类应用到你的el-table上：

<template>
  <el-table :class="['custom-scrollbar', tableClass]">
    <!-- 表格内容 -->
  </el-table>
</template>

<script>
export default {
  data() {
    return {
      tableClass: '', // 这里可以根据需要添加其他类名
    };
  },
};
</script>

这会使得火狐下的滚动条采用定制的颜色和样式。请注意，由于火狐对于`-moz-scrollbar`的支持不如WebKit广泛，某些效果可能会有所差异。如果你希望所有现代浏览器都有良好的体验，最好还是考虑使用JavaScript库如better-scroll等提供更丰富的滚动条替代方案。