将样式添加到 AgGrid 中的特定 header 单元格

Adding styles to a specific header cell in AgGrid

我正在开发 AgGrid(AgGridReact 组件),其中一个 header 单元有一个 'select all'

的复选框

想知道是否有办法 pad/margin select-all 复选框与列中的复选框对齐。

您可以将 headerClass 添加到特定列定义并像往常一样应用 css 样式

const columnDefs = [
  {
    checkboxSelection: true,
    headerCheckboxSelection: true,
    headerClass: "checkbox",
    width: 70
  },
  {
    headerName: "ID",
    field: "id",
    width: 70
  },
  ...
}

Css

/* add role attribute to increase specificity */
.ag-header-cell.checkbox[role="presentation"] {
  padding: 20px;
}

现场演示