Ayyıldız2 | 2008 TR Yapısı • 1-99 Orta Emek Destan • Oto Avsız • 10 Temmuz 21:00 HEMEN TIKLA!
BOOTSTRAP 4’DE RENK KODLARI VE CLASS’LAR
Bootstrap kullanmanın birçok faydasını biliyoruz. Bunlardan biride hazır class’ları kullanarak hem arkaplan rengi hem de yazı rengini verebiliyor olmamız. Bu yazımızda arkaplan ve yazı renklerini verebilmek için hangi class’ları kullanmamız gerektiğinden bahsedeceğiz. Birde bu class’ların hangi renk kodları ile oluşturulduğuna bakacağız.
ARKAPLAN RENGİ İÇİN KULLANABİLECEĞİMİZ CLASS’LAR VE RENK KODLARI
Arka plan rengi verebilmek için kullanabileceğimiz class isimleri ve renk kodları tablosu şu şekilde:| Class | Renk Kodları |
|---|---|
| bg-primary | #007bff |
| bg-info | #17a2b8 |
| bg-danger | #dc3545 |
| bg-warning | #ffc107 |
| bg-success | #28a745 |
| bg-secondary | #6c757d |
| bg-dark | #343a40 |
| bg-light | #f8f9fa |
Gördüğünüz gibi Bootstrap 4 ile arkaplan rengi verebilmek için 8 farklı class’ı kullanabiliyoruz.
YAZILAR İÇİN KULLANABİLECEĞİMİZ CLASS’LAR VE RENK KODLARI
Yazı rengi verebilmek için kullanabileceğimiz class isimleri ve renk kodları tablosu şu şekilde:
| Class | Renk Kodları |
|---|---|
| text-primary | #007bff |
| text-info | #17a2b8 |
| text-danger | #dc3545 |
| text-warning | #ffc107 |
| text-success | #28a745 |
| text-secondary | #6c757d |
| text-dark | #343a40 |
| text-muted | #6c757d |
| text-light | #f8f9fa |
| text-white | #ffffff |
Gördüğünüz gibi Bootstrap 4 ile yazı rengi verebilmek için 10 farklı class’ı kullanabiliyoruz.
Not : .text-black-50 class’ı ile yazılara siyah rengi %50 şeffaflaştırarak verebiliriz. Aynı şekilde .text-white-50 class’ı ile yazılara beyaz rengi %50 şeffaflaştırarak verebiliriz.
.
Şu yazılar da ilginizi çekebilir.
Tüm Renk İsimleri ve Renk Kodları (Html, Css, Hex, Rgb)
Web Tasarımlarınızda Kullanabileceğiniz Tam 150 Farklı Renk Paleti
Umarım sizin için faydalı bir yazı olmuştur.
