Caricamento degli stili nei Component con Angular 2

di ,

Spesso capita di aver la necessità di referenziare degli stili insieme ad un Component, per assegnare un layout grafico particolare ad una certa parte delle nostra applicazione.

In questo caso, Angular 2 ci viene in aiuto, consentendoci di sfruttare diverse modalità per inserire stili all'interno di un Component.

Possiamo definire gli stili in linea, in questo modo:

@Component({
  selector: 'myapp',
  template: `
    <h1>La mia app Angular 2</h1>`,
  styles: ['h1 { color: red; }']
})

E anche specificando direttamente il tag style:

@Component({
  selector: 'myapp',
  template: `
    <style>
      h1 {
        color: red;
      }
    <h1>La mia app Angular 2</h1>`
})

In questo caso, vale anche la regola dell'inclusione di un file CSS esterno mediamente il tag link.

Inoltre, possiamo referenziare un file con i CSS esterno, in questo modo:

@Component({
  selector: 'myapp',
  template: `
    <h1>La mia app Angular 2</h1>`,
  styleUrls: ['app/style.css']
})

Commenti

Visualizza/aggiungi commenti

Caricamento degli stili nei Component con Angular 2 (#176) 1010 2
| Condividi su: Twitter, Facebook, LinkedIn, Google+

Per inserire un commento, devi avere un account.

Fai il login e torna a questa pagina, oppure registrati alla nostra community.

Approfondimenti

I più letti di oggi