element的表格行高度
时间: 2023-07-08 21:30:49 浏览: 72
基于elementUI竖向表格、和并列的案例
在 Element UI 的 `<el-table>` 组件中,可以使用 `row-height` 属性来设置表格行的高度。例如,设置所有表格行的高度为 50 像素:
```html
<el-table :data="tableData" row-height="50">
<el-table-column prop="name" label="姓名"></el-table-column>
<el-table-column prop="age" label="年龄"></el-table-column>
</el-table>
```
在上面的示例中,使用了 `row-height` 属性将表格行的高度设置为 50 像素。注意,该属性是直接应用于所有表格行的,如果需要对某个特定的表格行设置不同的高度,可以通过 CSS 来实现。可以在组件外部定义一个 CSS 类,然后在表格行的 `row-class-name` 属性中指定该类名,如下所示:
```html
<style>
.taller-row {
height: 60px;
}
</style>
<el-table :data="tableData" row-class-name="taller-row">
<el-table-column prop="name" label="姓名"></el-table-column>
<el-table-column prop="age" label="年龄"></el-table-column>
</el-table>
```
在上面的示例中,定义了一个 `.taller-row` 类来设置行高为 60 像素,然后在表格的 `row-class-name` 属性中指定该类名,从而使指定的表格行具有不同的高度。
阅读全文