Bootstrap, HTML, CSS ve JS web uygulamaları oluşturmak için yaygın olarak kullanılan bir ön uç çerçevesidir (frontend framework).Kullanımı kolaydır. Çoğunlukla tasarım şablonlarını kullanarak mobil uygulamalar oluşturmaya odaklanır. Ayrıca açılır menüler, formlar, düğmeler, düğme grupları, uyarılar, kartlar, sekmeler ve daha birçok bileşen gibi etkileşimli bileşenler de oluşturmak mümkündür.
Web Arayüz Programlama — Ünite 4 Soru-Cevap
Web Arayüz Programlama (BIL205U) soru-cevapları.
Bootstrap nedir?
Bootstrap içerisinde kaç adet kapsayıcı vardır? Bunlar nelerdir?
3 adet kapsayıcı vardır.
- Varsayılan kapsayıcı
- Full kapsayıcı
- Duyarlı kapsayıcı
Bir bootstrap kodunda xs, sm, md, lg, xl, xxl sınıf kodları neyi belirlemektedir?
Bu sınıf kodları ekran türlerini ve boyutlarını belirlemektedir.
Duyarlı kapsayıcı ne için kullanılır?
Duyarlı kapsayıcılar, içeriğin belirtilen sınır değerine kadar %100 genişlikte, sınır değeri aşıldıktan sonra ise kenarlardan boşluk bırakarak yerleştirilmesi istenilen durumlarda kullanılır
Bootstrap grid yapısında sayfa kaç eşit sütuna bölünmektedir?
Bootstrap grid yapısında sayfa 12 eşit sütuna bölünmektedir.
Aşağıda verilen şekilde gridler oluşturmak için gereken boottrap kodu nedir?
Bootstrap flex yapısı yönlendiricileri kaç tanedir ve bunlar nelerdir?
Bootstrap flex yapısı yönlendiricileri 4 adettir Bunlar:
• .flex-row
• .flex-row-reverse
• .flex-column
• .flex-column-reverse
Bootstrap kodları içerisinde justify-content sınıfları ne işe yarar?
justify-content, ögeleri flex yapısındaki ana eksenin neresine yerleştirmek iistediğimizi belirleyen sınıflardır.
Bootstrap kodları içerisinde align-items sınıfları ne işe yarar?
align-items sınıfları ögeleri flex yapısındaki ana eksenin tersi yönünde yerleştirmek için kullanılır.
Aşağıda bir buton grubu görüntüsü ve ona ait bootstrap kod bulunmaktadır.
Kod :
Bu buton grubunun aşağıda verilen şekildeki gibi etrafında bir bordür görünmesi için ne önerirsiniz?
Aşağıda verildiği gibi div olarak tanımlanan ayracın stilini değiştirmek mümkün.
Bir bootstrap kodunda metni ekranın ortasına hizalamak için kullanılacak sınıf nedir?
Ekran alanında ortalama hizalama: text-center
Bir bootstrap kodunda text-muted sınıfı ne için kullanılır?
Yazının daha soluk biçimde belirmesini sağlayan bir sınıftır.
Aşağıda bir bootstrap kod parçası görülmektedir. 21. satırda görülen m-3 özelliğinin işleve nedir?
m-3 birinci flex parçası için marjin tanımlamada kullanılmıştır. Marjin boyut 3 olarak tanımlanmıştır.
Bootstrap m (margin) ve p (padding) için kullanılabilecek en büyük değer kaçtır?
5 olarak tanımlanmıştır.
Aşağıda şekilde görünen tipte bir buttonu sayfaya ekleyebilmek için gereken bootstrap kodu nedir?
Button :
Not : Primary renk kodunu da belirtmektedir.
Bootstrap kodlarında kullanılabilecek farklı button tipleri nelerdir?
- Renkli Buton
- Çevresi renkli Buton
- Küçük Buton
- Büyük Buton
- Gruplanmış Buttonlar
Bootstrap kodu yazarken butonların boyutlarını belirlemek için kullanılacak sınıflar nelerdir?
btn-lg : Button boyutunu büyütmek için kullanılır.
btn-sm : Button boyutunu küçültmek için kullanılır.
Aşağıdaki şekilde bir button grubu oluşturmak için gereken bootstrap kodu nedir?
Aşağıda bootstrap kodunda verilen card sınıfında Alan 3 olarak adlandırılan sınıfı yaratmak için gereken kod nedir?
.navbar-expand-sm sınıfının kullanım alanı nedir?
.navbar-expand-md navigasyon linklerinin yatık telefon ekranı ve daha büyük ekranlarda gösterilip, daha küçük ekranlarda menü butonunun altında toplanması için, kapsayıcı elemana atanmasını sağlamaktadır.