css中如何设置element ui 表格中 row-key产生的字体图标脱离文档流并且每个层级的图标都会显示在当前文字的旁边
时间: 2024-03-06 08:47:29 浏览: 102
如果你想实现在每个层级的图标都显示在当前文字的旁边,可以使用 CSS 的 `margin-left` 属性来实现。由于每个层级的图标都是相对于其父元素定位的,因此可以通过不断增加 `margin-left` 的值来实现相对定位。
以下是一个示例 CSS 代码:
```css
.el-table .el-table__row .el-table__expand-icon {
position: relative;
}
.el-table .el-table__row .el-table__expand-icon i {
position: absolute;
left: -20px;
top: 50%;
transform: translateY(-50%);
}
.el-table .el-table__row .el-table__expand-icon + td {
margin-left: 24px; /* 每个层级增加的 margin 值 */
}
```
其中,`.el-table__expand-icon` 是 row-key 产生的字体图标的 class,`i` 表示该图标。你可以根据实际情况调整 `left` 和 `margin-left` 的值。
阅读全文