Στυλ στοιχείων Angular

Ας δώσουμε στυλ στη σήμανσή μας χρησιμοποιώντας CSS. Για αυτό, θα χρειαστούμε το αρχείο app.component.css, στο οποίο γράφονται τα CSS στυλ για τη σήμανση του στοιχείου. Ταυτόχρονα, το Angular φροντίζει αυτόματα τα στυλ να λειτουργούν όπως τα CSS modules. Αυτό σημαίνει ότι όλοι οι επιλογείς θα λειτουργούν μόνο για τη σήμανση του στοιχείου και δεν θα επηρεάζουν τη σήμανση έξω από αυτό.

Ας δούμε πρακτικά. Ας υποθέσουμε ότι στο στοιχείο μας έχουμε την ακόλουθη σήμανση:

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

Ας ορίσουμε ένα χρώμα για το div:

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

Με αυτόν τον τρόπο, μπορούμε να είμαστε βέβαιοι ότι το στυλ θα εφαρμοστεί μόνο στα div μέσα στο στοιχείο μας, και σε κανένα άλλο.