css中如何设置element ui 表格中 row-key文字和表头文字向左130px
时间: 2024-03-06 19:46:36 浏览: 126
Element-UI升级后,el-table不显示 空白问题 备份包 资源备份
您可以通过以下 CSS 代码来实现该需求:
```css
.el-table__header-wrapper th, .el-table__body-wrapper td {
padding-left: 130px;
}
.el-table__header-wrapper th .cell, .el-table__body-wrapper td .cell {
text-indent: -130px;
}
.el-table__body-wrapper td .cell {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
```
其中,`.el-table__header-wrapper th` 和 `.el-table__body-wrapper td` 选择器用于选择表格中的表头和行数据,`padding-left` 属性用于设置左侧内边距的大小,从而将文本向右移动。`.el-table__header-wrapper th .cell` 和 `.el-table__body-wrapper td .cell` 选择器用于选择表格中的单元格,`text-indent` 属性用于设置文本的缩进大小,从而将文本向左移动。`.el-table__body-wrapper td .cell` 选择器中的样式用于处理表格中的文本溢出问题。
注意:如果您要针对特定的表格进行样式设置,可以通过给表格添加类名来限制 CSS 选择器的作用范围。
阅读全文