Hintergrundfarbe der ausgewählten Zeile in Angular UI einstellen Raster

Question

Ich habe überall auf Stackoverflow und Github gesucht, aber ich konnte keine Lösung für dieses Problem finden und ich hoffe, dass jemand mir die richtige Richtung zeigen kann.

Ich benutze Angular UI Grid für mein Projekt und bis jetzt läuft alles gut. Ich versuche nun, das CSS des Rasters zu ändern, indem ich die Standardklassen mit meinen eigenen überschreibe, damit es besser aussieht. Der Bereich, in dem ich gerade feststecke, ändert die Hintergrundfarbe der ausgewählten Zeilen.

Derzeit ist es die hellblaue Standardfarbe, die angezeigt wird, wenn eine Zeile ausgewählt wird, die nicht mit den anderen Farben in meiner Anwendung übereinstimmt. In Chrome Inspector-Tools wird angezeigt, dass die folgende Klasse auf die Zelle angewendet wird, die die Hintergrundfarbe bereitstellt.

.ui-grid-row.ui-grid-row-selected>[ui-grid-row]>.ui-grid-cell{ 
    background-color: #c9dde1; 
} 

Aber wenn ich versuche, wie unter dieser Klasse in meiner eigenen CSS-Datei zu überschreiben,

.ui-grid-row.ui-grid-row-selected>[ui-grid-row]>.ui-grid-cell{ 
    background-color: #efe8ed!important; 
}  

die Anwendung nimmt nach wie vor die Standardbibliothek Klasse und ihre Farbe.

Es gibt andere Gitterklassen, die ich in meinem eigenen CSS außer Kraft gesetzt habe, und sie sind gut wiedergegeben. Kann das ein Problem sein, weil diese Klasse dynamisch angewendet wird, wenn ich die Zeilen auswähle?

Gibt es eine Möglichkeit, wie ich meine eigene CSS-Klasse anwenden kann?

Vielen Dank für Ihre Zeit und Mühe.

Answer 1

In Chrome klicken Sie mit der rechten Maustaste auf das Zellengitter, das Sie bearbeiten möchten, und klicken Sie auf inspizieren, sehen Sie sich die Registerkarte Stile an und stellen Sie sicher, dass Sie den richtigen Stil bearbeiten. Es könnte von etwas übersteuert werden. Und versuchen Sie nicht, wichtig zu verwenden, es ist normalerweise eine schlechte Idee.