Nama-Nama class Bootstrap Untuk Mengganti Warna Tulisan dengan Cepat

Seperti yang kita ketahui, Bootstrap menyediakan warna yang mudah digunakan menggunakan class diantaranya warna biru, biru muda, merah, kuning / oranye, dan hijau. Warna-warna ini...


Ketika menggunakan framework tentu ada kelebihan tertentu yang disediakan oleh framework itu sendiri, seperti pada Bootstrap, kamu dapat memberikan warna teks selain warna default yaitu hitam. Bootstrap memiliki contextual class yang mudah digunakan hanya menggunakan class.

Ketika menggunakan HTML saja tentu harus mengaturnya di style / CSS bersangkutan hanya untuk memberikan warna pada tulisan, ini lebih panjang ketimbang menggunakan class dari Bootstrap. Jika belum menggunakan Bootstrap, silahkan ikuti tutorial bagaimana cara menggunakan Bootstrap.

Seperti yang kita ketahui, Bootstrap menyediakan warna yang mudah digunakan menggunakan class diantaranya warna biru, biru muda, merah, kuning / oranye, dan hijau. Warna-warna ini menandakan dari beberapa kondisi seperti penting, sukses, info, gagal, warning, dsb.

Warna-warna tersebut tidak hanya untuk tulisan saja melainkan untuk elemen lainnya seperti tombol, itu merupakan warna yang disediakan oleh Bootstrap dibuatkan ke dalam sebuah class agar mudah digunakan oleh siapapun. Adapun class yang dapat digunakan untuk memberi warna pada tulisan adalah:

  • class=”text-muted”, warna gelap / buram
  • class=”text-danger”, warna merah
  • class=”text-primary”, warna biru
  • class=”text-warning”, warna kuning / orange (browser)
  • class=”text-success”, warna hijau
  • class=”text-info”, warna biru muda

Lalu, Bagaimana Cara Menggunakannya ?

Berikan classclass di atas sesuai warna yang ingin digunakan pada pembungkus tulisan yang ingin diberikan warna, misalnya seperti ini:

<p>Baris ini menampilkan tulisan dalam tag p tanpa class, menampilkan warna default (hitam):</p>
<p class="text-muted">Tulisan ini diberi class text-muted</p>
<p class="text-danger">Tulisan ini diberi class text-danger</p>
<p class="text-primary">Tulisan ini diberi class text-primary</p>
<p class="text-warning">Tulisan ini diberi class text-warning</p>
<p class="text-success">Tulisan ini diberi class text-success</p>
<p class="text-info">Tulisan ini diberi class text-info</p>

Hasilnya akan terlihat seperti ini:

gambar 1 - class warna tulisan bootstrap

Itulah nama class untuk tulisan pada situs yang dibangun menggunakan Bootstrap untuk memberikan warna pada tulisan dengan cepat, selamat mencoba !


Jangan Lupa Share !!!

70
11 shares, 70 points

Apa Reaksimu ?

Bingung Bingung
3
Bingung
Kesal Kesal
1
Kesal
OMG OMG
4
OMG
Takut Takut
3
Takut
Keren Keren
11
Keren
Sedih Sedih
5
Sedih
Posciety Tech

Pro

Official Channel Posciety.Com yang menyuguhkan informasi dan updates seputar dunia teknologi.

0 Komentar

Pilih Format
Artikel
Default, Membuat Artikel/Cerita
List
Listicle, Misalnya: 3 Hal yang Wajib Dilakukan Saat...
Kuis Kepribadian
Membuat kuis Tentang Kepribadian
Poll
Vote untuk Membuat Keputusan atau Mencari Saran
Meme
Membuat Meme dari Gambar Normal yang Kamu Miliki