Styly komponentu Angular

Pojďme nyní naši verštuku ostylovat pomocí CSS. K tomu se nám bude hodit soubor app.component.css, ve kterém se píší CSS styly pro verštuku komponentu. Angular sám dbá na to, aby styly fungovaly jako CSS modul. To znamená, že všechny selektory budou fungovat pouze pro verštuku komponentu a nebudou zachycovat verštuku zvenčí.

Podívejme se na praxi. Mějme v našem komponentu následující verštuku:

app/app.component.html<div>
  abcde
</div>

Pojďme nastavit barvu divu:

app/app.component.cssdiv {
  color: red;
}

Zároveň můžeme být jisti, že styl se aplikuje pouze na divy z našeho komponentu, a ne na žádné jiné.