Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
Sıfırdan Bootstrap: Temel Öğeler ve Komponentler
Rating: 4.7 out of 5(66 ratings)
4,236 students

Sıfırdan Bootstrap: Temel Öğeler ve Komponentler

Bootstrap , Web Tasarım , Web Sitesi yapma
Created byTuncay EROL
Last updated 12/2022
Turkish
Turkish [Auto],

What you'll learn

  • Bootstrap ile kodlama mantığını öğrenecek
  • Bootstrap'ı bilgisayarlarına yüklemeyi
  • Estetik Tasarım Yapmayı
  • En düşük kod ile en verimli çıktılar elde etmeyi

Course content

1 section14 lectures1h 20m total length
  • Gerekli Dosyaları İndirme1:39
  • 1. Bootstrap Nedir Projeye Bootstrap Ekleme4:36
  • 2. Alternatif Bootstrap Proje Ekleme Yöntemi1:40
  • 3. Container Kavramı4:19
  • 4. Grid Sistemi Satır ve Sütun Mantığı6:36
  • 5. Justify and Align Position Yatay ve Dikey Konumlandırmalar11:54
  • 6. Flex-Box Esnek Kutular2:23
  • 7. Renkler, Butonlar, Alert, ve d-Flex Column5:44
  • 8. Margin - Padding - Border5:05
  • 9. Cards E-Ticaret Tasarımı7:01
  • 10. Listeler ve Tablolar8:58
  • 11. Form , İnput, OverFlow, Row ve Col Genel Bilgilerle İletişim Formu13:03
  • 12. Animate.css Sitelerinizi Hareketlendirin2:54
  • 13. Align-Self Mantığı Belirli Kutulara-Objelere Hareket Verme4:37

Requirements

  • Giriş Seviyesi HTML ve CSS bilgisi

Description

Responsive Web Tasarımı Nedir?

Responsive web tasarımı, bir web sitesinin tüm cihazlarda iyi görünmesini sağlayan web sitesi tasarımına yaklaşmanın nispeten yeni bir yoludur. Duyarlı web sitelerinde, hangi cihazda olursanız olun aynı bilgi ve sayfa öğeleri görünür, ancak boyutlandırma ve düzenleme yöntemleri ekran boyutunuza göre değişir.

Web sitesi, cihazınızdan bağımsız olarak sezgisel bir deneyim sunmak için akıllı telefonların ve tabletlerin daha küçük ekran boyutuna uyum sağlar (veya yanıt verir). Uyarlanabilir bir tasarım ve esnek düzen, ziyaretçileriniz için daha iyi bir kullanıcı deneyimi sağlar ve arama motoru optimizasyon değerinizi artırmanıza yardımcı olur.

Neden Bootstrap Tercih Ediliyor?

Bunu 8 başlık altında değerlendirebiliriz.

1 - Bootstrap Responsive Yapı Sağlar

Bootstrap kendine ait kullanışlı bir grid sistemi ile gelmektedir. Böylece kendi grid sisteminizi tasarlamak için bir sürü zaman harcamanıza gerek kalmaz. Siz sadece içeriklerinize odaklanabilir, daha verimli olabilirsiniz.

2 - Bootstrap Responsive Resimler Sağlar

Bootstrap, görüntüleri geçerli ekran boyutuna göre otomatik olarak yeniden boyutlandırmak için kendi koduyla birlikte gelir. Görüntülerinize .img duyarlı sınıfı eklemeniz yeterlidir; önceden tanımlanmış CSS kuralları gerisini halleder.

İmg-circle ve img-round gibi sınıfların eklenmesiyle resimlerinizin şeklini bile değiştirebilirsiniz.

3 - Bootstrap Faydalı Komponentler İçerir

Bootstrap, web sayfanıza kolayca yapıştırabileceğiniz bir dizi özellik ile birlikte gelir.

  • Navigation bars

  • Dropdowns

  • Progress bars

  • Thumbnails

.. ve daha fazlası.

Web sayfanıza sadece göz alıcı tasarım öğeleri eklemek bir esinti olmakla kalmaz, aynı zamanda bunları görüntülemek için kullanılan ekran boyutu veya cihaz ne olursa olsun her birinin harika görüneceğini bilerek emin olabilirsiniz.

4. Bootstrap JavaScript Desteği Sağlar

Halen ikna olmadı iseniz JQquery’i deneyebilirsiniz.

Bootstrap ayrıca geliştiricilerin bir düzineden fazla özel JQuery eklentisinden faydalanmalarını sağlar. JQuery, modal pop-up'lar, geçişler, görüntü karuselleri ve - kişisel favorilerimden biri için - bir sayfada gezinirken gezinme çubuğunuzu otomatik olarak güncelleyen bir eklenti için etkileşimle oynamak için daha da fazla alan sunar.



*kaynak : argenova / Bootstrap nedir  ?

Who this course is for:

  • Web Tasarıma ilgisi olan herkese yöneliktir