如何使用 header 属性设置特定的 header 颜色？

Question

根据 Kendo grid documentation，我们可以使用 header 属性设置列的 header 属性：

$("#grid").kendoGrid({
  columns: [{
    field: "name",
    headerAttributes: {
      style: "text-align: right; font-size: 14px; color: red !important;"
    }
  }],
  dataSource: [ { name: "Jane Doe" }, { name: "John Doe" } ]
});

它适用于大多数属性，但不适用于颜色。它确实有意义，因为 link (k-link class) 的颜色属性将优先于 th 颜色属性。

但是，我想知道是否有一种解决方法可以让我在初始化网格时为特定 header 设置颜色。现在，我可能想到的唯一解决方案是在初始化网格后设置 link 颜色。

Answer 1

而不是添加无需大量黑客攻击即可被覆盖的内联样式，为什么不像这样使用 headerTemplate：

  field: "ContactName",
  title: "Contact Name",
  width: 200, 
  headerTemplate:'<label class="greenHeader">Contact Name</label>'

然后在您的样式表中添加适当的 css class，例如：

.greenHeader
    {
     color:green ;
    }

有关示例，请参阅此 dojo：

Example of header template being used.

如何使用 header 属性设置特定的 header 颜色？

How to set specific header color using the headerAttributes?

javascript

telerik

kendo-ui

kendo-grid