Kategori: Bootstrap 4

Bootstrap Dersleri ile ilgili en temel konulardan yani Bootstrap Nedir? Bootstrap Ne İşe Yarar? Bootstrap Nasıl Kullanılır? konularından başlayıp Bootstrap'ı tüm detaylarıyla öğrenmeye devam ediyoruz.

Bootstrap popover  da Bootstrap tooltip'lere benziyor. Bir Html öğesine tıklandığında istediğimiz metinlerin açılır kutuda görüntülenmesidir. Tooltip ile aralarındaki tek fark şudur; Popover'lar ile daha fazla içerik oluşturabiliyoruz. Örneğin metnin başlığı ve metnin içeriğini ayırabiliyoruz.

Bootstrap tooltip kullanarak çok kısa sürede sade ve şık araç ipuçları oluşturabiliriz. Tooltip, bir öğenin üzerine mouse ile gelindiğinde istediğimiz bilgilerin açılır bir kutu ile gösterilmesi diyebiliriz. Css kodları yazarak da istediğimiz araç ipuçlarını oluşturabiliriz ama …

Bootstrap list group class'larını kullanarak çok kısa sürede sade ve şık listeler oluşturabiliriz. Css kodu yazarak da istediğimiz listeleri oluşturabiliriz ama zamandan kazanmak adına kesinlikle Bootstrap kullanmanızı tavsiye ederim.

Öncelikle sayfalama butonlarına neden ihtiyaç duyuyoruz biraz ondan bahsedelim. Örneğin bir blog sitesi ve içerisinde yüzlerce yazı olduğunu düşünelim. Tüm bu yazıları anasayfada listelersek sayfa aşağı doğru baya uzayacaktır. Yada bir ETicaret sitesinde ürünlerin listelendiğini …

Bu yazımızda Bootstrap progress bar nedir, ne işe yarar, nasıl kullanılır gibi konuları öğreneceğiz. Progress bar yani ilerleme çubuklarını hepimiz görmüşüzdür. Örneğin bilgisayarımızda bir dosyayı kopyalarken, taşırken veya silerken işlemin toplamda ne kadar sürede tamamlanacağı veya …

Bootstrap badge ile herhangi bir içeriğe ek bilgiler ekleyebiliriz veya içeriğin daha dikkat çekici olması için arkaplan rengi verebiliriz. Örneğin Facebook üzerinden örnek vereyim. Facebook'ta mesaj veya bildirim geldiğinde bunları gösteren link butonların üzerinde ek …

Bootstrap button class'larını kullanarak çok kısa sürede sade ve şık butonlar yapabiliriz. Css kodu yazarak da istediğimiz butonları oluşturabiliriz ama zamandan kazanmak adına kesinlikle Bootstrap kullanmanızı tavsiye ederim. Bootstrap button class'larını <a>, <input> veya <button> …

Bootstrap alert class'ları ile istediğimiz amaca uygun uyarı mesajlarını gösterebilir, kullanıcıları bilgilendirebiliriz. Örneğin bir üyelik formu düşünelim. Üye olma işlemlerini gerçekleştirirken birçok durum meydana gelebilir. Eğer herhangi bir hata meydana gelmeden kayıt işlemi başarıyla gerçekleşirse, işlemin …

Bootstrap 4 ile resimlerimize stil vermek artık çok kolay. Örneğin bir resmi responsive hale getirebilir, tam yuvarlak veya köşelerden yuvarlatılmış bir şekle dönüştürebiliriz. Hem de hiç Css kodu yazmadan. Yapmamız gereken tek şey, resmin src …

Bootstrap 4 ile tablolarımıza stil vermek artık çok kolay. Yapmamız gereken tek şey, öncelikle tablomuzu Html ile yazmak. Daha sonra ise nasıl bir tasarım istiyorsak ona uygun bootstrap table class'larını kullanmak. Bu bootstrap table class'larının neler …

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 …