如何在 Handsontable 中更改 header 背景颜色和字体颜色

Question

问题：我可以更改单元格的背景颜色，但不能更改 header。我可以更改 Handsontable 中 header 的背景颜色和字体颜色吗？

Answer 1

您可以为此使用 jquery 或 css。例如，将背景颜色应用于所有 span.colHeader:

.handsontable span.colHeader {
    text-color: #B2B2FF; /* pink ish */
    background-color: #FF7878; /* red */
}

或者更简单，handsontable 允许 HTML 用于 col headers 因此作为一个选项，您可以提供 headers 的数组 HTML:

hot = new Handsontable(container, {
  data: items,
  startRows: 1,
  colHeaders: ['<label id="header1" style="background-color: blue">I'm the first header"</label>', '<label id="header2" style="background-color: red">I'm the second header"</label>']
  }
)

Answer 2

在文档头部添加样式标签。这将影响页面上的所有 HOT 网格。还在研究如何让不同的网格以不同的样式显示。

   .handsontable table thead th{
        background-color: green;
        color:white;
        font-weight:bold;
        font-size:12px;
    }

Answer 3

测试此 css 以更改手控 header 颜色

.handsontable th {color: #f5ffa5 !important; background: #78DEFF !important; }

如何在 Handsontable 中更改 header 背景颜色和字体颜色

How to change header background color and font color in Handsontable

handsontable