Latihan 1: Styling Angular — Angular

Latihan 1 dari materi Styling Angular di Angular — praktek dengan editor kode interaktif, test case otomatis, dan hint terpandu. Langsung jalan di browser.

Starter-nya sudah punya AppComponent (selector app-root, standalone: true) dengan template Teks berwarna biru. Biarkan semuanya, lalu:

Tambahkan properti styles di decorator @Component, di bawah template.
Isinya satu aturan: styles: [`p { color: blue; }`].

Jangan pakai atribut style="..." di ; warnanya harus datang dari styles komponen.

Yang dicek:

 berisi persis Teks berwarna biru.
Kodenya memuat styles.
Warna yang dipakai browser untuk  adalah rgb(0, 0, 255), yaitu biru.

Hint

CSS milik sebuah komponen ditulis di decorator-nya, dan Angular otomatis membatasinya ke template komponen itu.
Tambahkan satu properti lagi di @Component, sesudah template: styles, berisi aturan untuk p yang mengubah color jadi blue.
styles: [`p { color: blue; }`],

</> { } .css => #id fn()

Versi baru

HyperSheets

bagian dari BelajarWeb.dev

Membuka gerbang…

Latihan 1: Styling Angular — Angular

Hint

Memperbarui Aplikasi