Úhlové Materiál, barvu pozadí Tlačítka nemění na použití css

Question 1

Jsem rozvojové ukázkový projekt v Úhlové 13, ve kterém jsem použil Úhlovou Materiál téma. V komponent jsem použil materiál tlačítka pro odhlášení potvrzovací dialogové okno a změnil jsem tlačítko barvy pozadí na bílou barvu v css, ale když jsem spustit projekt stále zobrazuje výchozí šedé barvy i po použití css. Existuje nějaký způsob, jak vynutit změnu úhlové materiálu, barev, protože ten jsem použil nefunguje.

Níže jsou soubory kódu pro lepší pochopení

logout-dialog.component.html

<h1 mat-dialog-title class="logout-heading">Logout</h1>
<div mat-dialog-content>
  <p class="message">Are you sure you want to logout ?</p>
</div>
<div mat-dialog-actions class="buttons-div">
  <button mat-button class="cancel" (click)="cancel()">Cancel</button> //THIS BUTTON SHOULD HAVE WHITE BACKGROUND
  <button mat-button class="logout" (click)="logout()">Ok</button>
</div>

odhlášení-dialog.komponenta.css

.cancel {
  border: 1px solid #3f51b5;
  color: #3f51b5;
  background-color: #fff !important;
}

Obrázek

Nějaké řešení prosím ?

Question 2

Zkuste umístit styl na své styles.css soubor

Question 3

můžete zkusit s inline-css

<h1 mat-dialog-title class="logout-heading">Logout</h1>
<div mat-dialog-content>
  <p class="message">Are you sure you want to logout ?</p>
</div>
<div mat-dialog-actions class="buttons-div">
  <button style="background-color: #fff !important;" mat-button class="cancel" (click)="cancel()">Cancel</button>  //my changes
  <button mat-button class="logout" (click)="logout()">Ok</button>
</div>

Question 4

Možná můžete zkusit pomocí ::ng-deep volič

::ng-deep button.cancel {
  border: 1px solid #3f51b5;
  color: #3f51b5;
  background-color: #fff !important;
}

Kibé M.C · Answer 1 · 2021-11-24T09:23:52

0

Zkuste umístit styl na své styles.css soubor

Kibé M.C

2021-11-24 09:23:52

Ahoj Kibe M. C snažil jsem se uvedení ve velkém stylu.css, ale nefunguje

Mohit Kumar Sharma

Zkuste kontroly, který konkrétní prvek stisknutím ctrl+shift+i na váš prohlížeč, a použití CSS.

Kibé M.C

Ahoj Kibé M. C , snažil jsem se ji viděli, to ukazuje, použitá barva v css, ale ne na prohlížeč

Mohit Kumar Sharma

Dako patel · Answer 2 · 2021-11-24T09:29:20

můžete zkusit s inline-css

<h1 mat-dialog-title class="logout-heading">Logout</h1>
<div mat-dialog-content>
  <p class="message">Are you sure you want to logout ?</p>
</div>
<div mat-dialog-actions class="buttons-div">
  <button style="background-color: #fff !important;" mat-button class="cancel" (click)="cancel()">Cancel</button>  //my changes
  <button mat-button class="logout" (click)="logout()">Ok</button>
</div>

Farith Adnan · Answer 3 · 2021-11-25T04:29:37

Možná můžete zkusit pomocí ::ng-deep volič

::ng-deep button.cancel {
  border: 1px solid #3f51b5;
  color: #3f51b5;
  background-color: #fff !important;
}

Ahoj Farith Adnan, jsem se snažil, ale nefungovalo to i když

Úhlové Materiál, barvu pozadí Tlačítka nemění na použití css

Otázka

V jiných jazycích

Tato stránka je v jiných jazycích

Populární v této kategorii

Oblíbené položky v této kategorii