当前位置:   article > 正文

修改el-table表头,表格和边框样式_el-table怎么设置边框

el-table怎么设置边框

在main.js里引入的scss文件里修改样式

比如在main.js里引入import '@/style/business.

然后直接在business设置样式就可以

 

  1. //tablebox 是给el-table设置的类名
  2. //设置$TableBorder全局变量可以把body里所有的边框颜色设置一样
  3. .tablebox{
  4. //表格四个边框的颜色
  5. border: 1px solid $lineColor !important;
  6. th.el-table__cell {
  7. border:none !important;
  8. }
  9. .el-table__header-wrapper, .el-table__fixed-header-wrapper {
  10. //表头的样式
  11. th {
  12. word-break: break-word;
  13. background:$TableThStyle !important;
  14. color: #939598 !important;
  15. height: 40px !important;
  16. font-size: 13px;
  17. border-bottom: 1px solid $TableBorder !important;
  18. border-right: 1px solid $TableBorder !important;
  19. }
  20. }
  21. .el-table__body-wrapper {
  22. //table_body单元格的样式
  23. td {
  24. background-color: $TableStyle !important;
  25. text-align: center;
  26. color: #e3e3ef;
  27. }
  28. }
  29. .el-table--border .el-table__cell, .el-table__body-wrapper td {
  30. //body里y轴的样式
  31. border-right: 1px solid $TableBorder !important ;
  32. }
  33. td.el-table__cell{
  34. //body里x轴的样式
  35. border-bottom: 1px solid $TableBorder !important ;
  36. }
  37. }
声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/繁依Fanyi0/article/detail/113666
推荐阅读
相关标签
  

闽ICP备14008679号