vue elementui 表设置
1 表头设置 样式 颜色 边框 -->header-cell-style。3 给容器内部的 table 添加背景色 并设置边框。2 el-side 中列表的 右边边框不显示。4 给table 设置行高。
·
1 表头设置 样式 颜色 边框 -->header-cell-style
<el-table border
:header-cell-style="{ color: '#FFF', background: '#191919', border: '1px solid #222222' }"
>
2 el-side 中列表的 右边边框不显示
/*去掉左侧菜单自带的右侧边框*/
.el-menu-vertical-demo {
// F12 Elments 查看class
border-right: none !important;
}
3 给容器内部的 table 添加背景色 并设置边框
.main-left /deep/ .el-table {
// 给容器内部的 表格添加背景色
background-color: #191919 !important;
margin: 0; // div 四周不留白
padding: 0; // div 四周不留白
border: 1px solid #222222; // div 边框设置颜色 https://blog.csdn.net/qq_47354826/article/details/116211265
}
4 给table 设置行高
.el-main {
line-height: 20px !important; //设置table 表头行高
}
5 table 每列单独设置颜色
<el-table-column prop="instId" label="名称" width="100px">
<!-- //用插槽的方法来改变颜色! -->
<template slot-scope="scope">
<div style="color: #FEC53F">
<!--下面用 prop 的值-->
{{ scope.row.instId }}
</div>
</template>
</el-table-column>
6 element-ui中使用Container 布局容器时出现白边问题--> app.vue ->设置样式
body{
margin: 0px;
}
更多推荐
已为社区贡献1条内容
所有评论(0)