Pembahasan Warna pada Bootstrap 4

Bootstrap 4 memiliki beberapa Class yang dapat kita gunakan untuk mengatur Style warna. Class untuk warna yang tersedia antara lain: .text-muted, .text-primary, .text-success, .text-info, .text-warning, .text-danger, .text-secondary, .text-white, .text-dark, .text-body (Warna Default body hitam/putih) dan .text-light.


Warna Teks pada Bootstrap 4

Berikut adalah contoh warna yang menggunakan Class pada Bootstrap 4:

 Warna Teks pada Bootstrap 4

Lihat kode di Github | Lihat Live Demo

Class warna konteks juga dapat digunakan pada Link yang mana akan menambahkan warna gelap ketika di Hover. Berikut adalah contohnya:

Link Hover

Lihat kode di Github | Lihat Live Demo

Kalian juga dapat menambahkan Opacity 50% untuk teks yang berwarna hitam atau putih dengan menggunakan Class .text-black-50 atau .text-white-50. Berikut adalah contohnya:

Warna Opacity

Lihat kode di Github | Lihat Live Demo

Warna Background pada Bootstrap 4

Class untuk warna Background adalah: .bg-primary, .bg-success, .bg-info, .bg-warning, .bg-danger, .bg-secondary, .bg-dark dan .bg-light.

Perlu dicatat bahwasannya warna Background tidak akan mengubah warna teks, jadi pada beberapa kasus, kalian dapat menggunakannya bersamaan dengan Class .text-#. Berikut adalah contohnya:

Warna Background pada Bootstrap 4

Lihat kode di Github | Lihat Live Demo

0 Komentar