Aşağıdaki boş alana 4 farklı renkte kart oluşturun. Her kart farklı bir bg- sınıfı kullanmalı.
Kullanılacak sınıflar: bg-primary, bg-success, bg-danger, bg-warning, text-white, p-3, m-2
3 sütunlu bir grid oluşturun. Mobile'da 12, tablet'te 6, desktop'ta 4 genişliğinde olmalı.
Kullanılacak sınıflar: row, col-12, col-md-6, col-lg-4, bg-info, text-white, p-3
Farklı boyut ve stillerde 6 buton oluşturun. İkonlar ekleyin.
Kullanılacak sınıflar: btn, btn-primary, btn-outline-success, btn-lg, btn-sm, bi-*
d-flex kullanarak 3 kutu oluşturun. Kutular aralarında eşit boşluk olacak şekilde dağılsın (justify-content-between).
Kullanılacak sınıflar: d-flex, justify-content-between, bg-primary, text-white, p-3
Bir ürün kartı tasarlayın. Resim, başlık, açıklama ve buton içermeli.
Kullanılacak sınıflar: card, card-img-top, card-body, card-title, card-text, btn
Email, mesaj alanı ve gönder butonu içeren bir form oluşturun.
Kullanılacak sınıflar: mb-3, form-label, form-control, btn
4 kutu oluşturun. Her kutunun farklı margin ve padding değerleri olsun.
Kullanılacak sınıflar: m-*, p-*, mt-*, mb-*, mx-*, my-*, bg-*
Border, shadow, rounded ve width sınıflarını kullanarak 3 farklı kutu tasarlayın.
Kullanılacak sınıflar: border, rounded, shadow, w-*, bg-*, p-*
Öğrendiklerinizi kullanarak istediğiniz tasarımı yapın!