angularjs ng-grid：如何更改标题样式答案

【问题标题】：angularjs ng-grid: how to change header styleangularjs ng-grid：如何更改标题样式
【发布时间】：2014-07-03 05:28:08
【问题描述】：

如何重新设置 ng-grid 的标题？特别是如何更改标题行的背景颜色和文本颜色？

【问题讨论】：

请问为什么是-1？

标签： css angularjs ng-grid

【解决方案1】：

您可以覆盖在ng-grid.css 中声明的.ngHeaderCell 类的background-color 属性，以在标题单元格上使用所需的背景颜色。

如果您不想修改原始 ng-grid css，您可以创建自己的 css 并在 ng-grid 的 css 之后加载它，您可以稍后在其中覆盖相同的 .ngHeaderCell 类：

.ngHeaderCell {
    background-color: [your background color] !important;
    bottom: 0;
    color: [your foreground color] !important;
    position: absolute;
    top: 0;
}

【讨论】：

谢谢！我的错，我不知道要修改哪个 css 类。我正在尝试使用 headerCellTemplate。这非常有效。
不客气。在这些情况下，Firebug 及其等价物总是派上用场。您可以检查要检查的元素，并且有一个面板，Firebug 会在其中显示哪些 CSS 规则应用于该元素以及这些规则的来源。
我最终覆盖了.ngTopPanel 类上的background-color

【解决方案2】：

我之前没有研究过 ng-grid，但看起来好像提供了一个 css 文件来进行样式设置？我建议要么更改实际的 css 文件，要么通过在声明 grid.css 的下方声明您自己的来覆盖这些更改。检查链接是否就是您所说的。

https://github.com/angular-ui/ng-grid/blob/master/ng-grid.css

例如，上面文件中的一个 css 属性如下，只需执行 ctrl-f 并找到您要更改的属性。

.ngHeaderCell {
    position: absolute;
    top: 0;
    bottom: 0;
    background-color: inherit;
 }

【讨论】：