columns.headerAttributes Object

HTML attributes of the column header. The grid renders a table header cell (<th>) for every column. The headerAttributes option can be used to set the HTML attributes of that th.

HTML attributes which are JavaScript keywords (e.g. class) must be quoted.

Example - set the column header HTML attributes

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [{
    field: "name",
    headerAttributes: {
      "class": "table-header-cell !k-text-right",
      style: "font-size: 14px"
    }
  }],
  dataSource: [ { name: "Jane Doe" }, { name: "John Doe" } ]
});
</script>

The table header cell will look like this: <th class="table-header-cell" style="text-align: right; font-size: 14px">name</th>.

In this article