设置对角线
效果图如下
html代码
<el-table :data="tableList" border stripe show-summary :summary-method="totalOutYear">
<el-table-column prop="contractBelongToDeptName" label="指标" width="300" align="center" fixed>
<el-table-column
prop="contractBelongToDeptName"
label="填报部门"
align="center"
width="300"
fixed
></el-table-column>
</el-table-column>
...
</el-table>
style样式
/* 这里主要的作用就是用来强制修改element默认的样式*/
.el-table thead.is-group th {
background: none;
padding: 0px;
height: 27.4px;
}
.el-table thead.is-group tr:first-of-type th:first-of-type {
border-bottom: none; /*中间的横线去掉*/
}
.el-table thead.is-group tr:first-of-type th:first-of-type div.cell {
text-align: right; /*上边文字靠右*/
}
.el-table thead.is-group tr:last-of-type th:first-of-type div.cell {
text-align: left; /*下边文字靠左*/
}
/*核心代码*/
.el-table thead.is-group tr:first-of-type th:first-of-type:before {
content: "";
position: absolute;
width: 1px;
height: 300px; /*斜线的长度*/
top: 0;
left: 0;
background-color: grey;
opacity: 0.2;
display: block;
transform: rotate(-74.5deg); /*调整斜线的角度*/
transform-origin: top;
}
标签:el,group,表格,Element,th,对角线,table,type,first
From: https://www.cnblogs.com/sglblog/p/17150709.html