el-descriptions宽度固定,不随着内容变化
时间: 2024-12-05 10:11:18 浏览: 30
RM-MPU-9250A-00.pdf
`el-descriptions` 是 Element UI 提供的一个用于显示描述列表的组件,它可以帮助组织信息并保持清晰的结构。当你需要设置其宽度为固定值而不是自适应内容时,可以在 CSS 中针对 `.el-descriptions` 类添加样式规则,例如:
```css
.el-descriptions {
width: 300px; /* 可以根据需要设置具体的像素值 */
overflow-x: auto;
}
```
这里的 `width` 属性设置了描述列表的总宽度,`overflow-x: auto;` 则会让超出的部分产生水平滚动条,确保内容可视。
如果你想要所有行都等宽,可以考虑给每个 `.el-descriptions-item` 设置宽度,并启用 `flex-wrap: wrap;` 来允许换行:
```css
.el-descriptions .el-descriptions-item {
flex: 1;
width: calc(100% / var(--el-descriptions-count));
box-sizing: border-box;
}
```
这里假设 `var(--el-descriptions-count)` 是描述项的数量,计算出平均宽度分配给每一项。
阅读全文