用于鼠标悬停的ngx-datatable css样式

问题描述 投票:2回答:2

我正在使用带引导主题的ngx-datatable。当鼠标悬停在细胞上时,我找不到或弄清楚如何改变样式?在这个例子中它变灰了

http://swimlane.github.io/ngx-datatable/#css

我已经能够像这样改变激活颜色,只是无法弄清楚悬停颜色。

::ng-deep .ngx-datatable.bootstrap .datatable-body .datatable-body-
row.active {
  background-color: #006eff;
  color: #FFF;
}
css angular ngx-datatable
2个回答
6
投票
.ngx-datatable.bootstrap:not(.cell-selection) .datatable-body-row:hover,
.ngx-datatable.material:not(.cell-selection) .datatable-body-row:hover .datatable-row-group
{ 
   background: red;
}

这有效。


1
投票
 :host
  ::ng-deep
  .ngx-datatable.bootstrap:not(.cell-selection)
  .datatable-body-row:hover,
:host
  ::ng-deep
  .ngx-datatable.material:not(.cell-selection)
  .datatable-body-row:hover
  .datatable-row-group {
  background: red;
}

我不得不补充一下

    :host
  ::ng-deep

然后它开始工作了。

您可以更改其他默认样式,因为存在线性转换:

:host
  ::ng-deep
  .ngx-datatable.material:not(.cell-selection)
  .datatable-body-row:hover {
  background-color: #007bff2e;
}
© www.soinside.com 2019 - 2024. All rights reserved.