Bootstrap

Bootstrap Nasıl Kullanılır?

Geliştirilecek web sitelerde Bootstrap kullanmanın iki yolu vardır.
1.yol : getbootstrap.com adresinden indirilebilir.
2.yol : CDN bağlantısı ile Bootstrap eklenebilir. Aşağıdaki resimde görüldüğü gibi eklenebilir.

maxcdn

MaxCDN bağlantıları ile Bootstrap kullanımı

CDN Kullanmanın Avantajı

Birçok CDN, web sayfasını ziyaret eden kullanıcının bulunduğu yere en yakın lokasyondan dosyayı temin eder. Bu durum dosyanın daha hızlı yüklenmesini sağlar. Diğer bir avantajı ise cache den dosyayı temin etmesidir. Bu durum da hızı arttırır.

Bootstrap İle İlk Web Sayfası

  • HTML5 doctype bildiriminin eklenmesi

Bootstrap HTML elementlerini ve CSS özelliklerini kullanır bunun için HTML5 doctype bildirimi yapılmalıdır. Bunun ardından doğru karakter setinin ve dil özelliklerinin kullanılabilmesi için meta etiketi ile tanımların Şekil-3’te görüldüğü gibi yapılması gerekmektedir.

  • Bootstrap mobile-first

Bootstrap mobil sürücüler için uygun-duyarlı olması için tasarlanmıştır. Mobile-first sitiller framework çekirdeğinde önemli bir parçadır. Sayfanın gösterim esnasında doğru olarak hazırlanması / oluşturulması ve dokunmatik yakınlaştırma işleminin düzgün sonuç vermesi için head bloğu içinde meta etiketine Şekil-4’te görüldüğü gibi content parametresinin eklenmesi gerekmektedir.

width=device-width: sayfanın genişliğini sürücünün ekran genişliğini takip edecek şekilde ayarlar.

initial-scale=1: sayfanın browserda ilk yüklendiği anki başlangıç zoom seviyesini belirler.

  • Containers

Bootstrap’ta site içeriğini saracak container elementlerin kullanılması gerekmektedir. İki container class’ı mevcuttur.

.container class’ı

.container-fluid class’ı

container class’ı kullanımı

container class’ı kullanımı

container-fluid class’ı kullanımı

container-fluid class’ı kullanımı

Yorum Yap