columnMode表头高度怎么调整

在 columnMode 模式下，表头高度可以通过以下两种方法进行调整：

1. 使用 CSS 样式

可以通过 CSS 样式来调整表头的高度，例如：

.mat-header-cell {
  height: 50px;
}

其中，`.mat-header-cell` 是表头单元格的 CSS 类名，可以根据具体的表格组件进行调整。修改 `height` 属性值即可调整表头高度。

2. 使用 MatSortHeaderRow 组件

MatSortHeaderRow 组件是 Angular Material 中用于排序表格的组件，它也可以用来调整表头高度。在使用 MatSortHeaderRow 组件时，需要在 HTML 模板中添加以下代码：

<mat-header-row *matHeaderRowDef="displayedColumns; sticky: true" [style.height.px]="50"></mat-header-row>

其中，`[style.height.px]` 属性可以设置表头高度的值，单位为像素。通过修改该值即可调整表头高度。

相关问题

el-table-column禁用表头

可以使用el-table-column的属性disabled来禁用表头，具体实现方法如下：

<el-table :data="tableData">
  <el-table-column prop="name" label="姓名" :disabled="true"></el-table-column>
  <el-table-column prop="age" label="年龄"></el-table-column>
</el-table>

在上述代码中，我们将第一个表头“姓名”禁用了，而第二个表头“年龄”则没有被禁用。

el-table多级表头高度

el-table的多级表头高度与普通表头的高度相同，可以通过设置表头行高和单元格内部元素的高度来调整表头高度。 例如：

<el-table :data="tableData" style="width: 100%">
  <el-table-column prop="date" label="日期" width="180"></el-table-column>
  <el-table-column label="用户信息">
    <el-table-column prop="name" label="姓名" width="150"></el-table-column>
    <el-table-column prop="age" label="年龄" width="100"></el-table-column>
  </el-table-column>
  <el-table-column label="地址">
    <el-table-column prop="province" label="省份" width="120"></el-table-column>
    <el-table-column prop="city" label="市区" width="120"></el-table-column>
    <el-table-column prop="address" label="地址" width="300"></el-table-column>
  </el-table-column>
</el-table>

可以通过设置el-table-column的height属性来调整表头行高，例如：

<el-table :data="tableData" style="width: 100%">
  <el-table-column prop="date" label="日期" width="180"></el-table-column>
  <el-table-column label="用户信息" height="60">
    <el-table-column prop="name" label="姓名" width="150"></el-table-column>
    <el-table-column prop="age" label="年龄" width="100"></el-table-column>
  </el-table-column>
  <el-table-column label="地址" height="60">
    <el-table-column prop="province" label="省份" width="120"></el-table-column>
    <el-table-column prop="city" label="市区" width="120"></el-table-column>
    <el-table-column prop="address" label="地址" width="300"></el-table-column>
  </el-table-column>
</el-table>

可以通过在单元格内部元素（如文本、图标等）中设置line-height属性来调整单元格内部元素的高度，例如：

<el-table :data="tableData" style="width: 100%">
  <el-table-column prop="date" label="日期" width="180"></el-table-column>
  <el-table-column label="用户信息">
    <el-table-column prop="name" label="姓名" width="150">
      <template slot-scope="{row}">
        <div style="line-height: 40px">{{row.name}}</div>
      </template>
    </el-table-column>
    <el-table-column prop="age" label="年龄" width="100">
      <template slot-scope="{row}">
        <div style="line-height: 40px">{{row.age}}</div>
      </template>
    </el-table-column>
  </el-table-column>
  <el-table-column label="地址">
    <el-table-column prop="province" label="省份" width="120">
      <template slot-scope="{row}">
        <div style="line-height: 40px">{{row.province}}</div>
      </template>
    </el-table-column>
    <el-table-column prop="city" label="市区" width="120">
      <template slot-scope="{row}">
        <div style="line-height: 40px">{{row.city}}</div>
      </template>
    </el-table-column>
    <el-table-column prop="address" label="地址" width="300">
      <template slot-scope="{row}">
        <div style="line-height: 40px">{{row.address}}</div>
      </template>
    </el-table-column>
  </el-table-column>
</el-table>