element ui 表格改变字体颜色以及边框颜色，表头与表格内容错位设置，safira浏览器中单元格文字超出宽度显示省略号失效导致表格错位设置

Vue中

<style lang="scss" scoped>
  .shopStatistics{ // 表格外面父级元素类名
    /deep/ .el-table {
      thead {
        .cell {
          text-align: center; // 表头字体居中
        }
      }
      tr,td{
        text-align: center;  // 表格内容居中
        color: black; 
      }
      tr,th,td {
        border-color: black;  // 设置单元格border
        border-collapse: collapse; // 边框会合并为一个单一的边框
      }
    }
    /deep/ .el-table--border::after, .el-table--group::after {
      background-color: black; 
    }
    /deep/ .el-table::before {
      height: 0; 
    }
    /deep/ .el-table--border, .el-table--group {
      border-color: black;
    }
    /deep/ .el-table_1_column_9{
      border-right: none;
    }
    /deep/ .el-table__empty-block {
      border-bottom: 1px solid black;
    }
    /deep/ .el-table th.gutter{
      display: table-cell!important;  // 表头与表格内容错位须设置
    }
    /deep/ .el-table__body {
      width: 100%;   // 在ios的safira浏览器中单元格文字超出宽度显示省略号会失效，须设置这个
    }
  }
</style>