如何將Div的背景顏色設置爲Angular 2中的主要主題顏色材質

Question

我正在使用角度2材質的主題之一。我可以在材質組件上使用按鈕，工具欄上的主題顏色，使用color =「primary」。但我無法弄清楚如何主題div。我不想在.css文件中對散列進行硬編碼，因爲如果我決定更改主題，它需要在所有地方進行更改。我錯過了什麼嗎？什麼是最好的方法來做到這一點？

Answer 1

事實上，你不可能每一個HTML元素上使用color="primary"。

我所做的是一個叫color-primary

@import '~@angular/material/theming'; 
@include mat-core(); 

$primary: mat-palette($mat-deep-purple, 600, 500, 900); 
$accent: mat-palette($mat-amber, A400, A300, A600); 


.color-primary { 
    color: mat-color($primary); 
} 

.color-accent { 
    color: mat-color($accent); 
} 

當然類，我在這裏設置的顏色，但你可以創建另一個類，例如：background-color-primary。

（這裏是我的示例項目的鏈接：Pizza-Sync）。

Answer 2

的最佳方式是使用所定義的調色板的背景和前景。如果你想添加屬性。

See my answer to this post