element表格样式修改

450 阅读1分钟

element表格常用样式修改

width设置

表格每列宽度设置
一般写死宽度直接 width='xxx' 但是设置百分比无效
设置百分比 min-width='xx%'
min-width 是会按照比例分配剩余宽度的,也就是自适应
min-width='2' 也可以直接设置数字
注意:使用 min-width 必须每列都设置,否则没设置的那列会很长

在这里插入图片描述
表格线条设置

element默认的表格线条比较淡,可以通过这些属性修改

.el-table td,
.el-table th.is-leaf,
.el-table--border,
.el-table--group {
    border-color: #999;
  }
  
.el-table--border::after,
.el-table--group::after,
.el-table::before {
    background-color: #999;
  }
  
.el-table thead,.el-table{ color: #999; }

还有官网介绍的这些
在这里插入图片描述
header-cell-class-name 设置表头样式
在这里插入图片描述
在这里插入图片描述
其余也是一样,看官网解释都可实现