Yapay zekadan makale özeti
- Kısa
- Ayrıntılı
- Bu video, bir eğitim içeriği olup, bir eğitmen tarafından grid sistemi konusunda uygulamalı bir ders sunulmaktadır.
- Videoda grid sisteminin temel mantığı anlatılmakta ve bir uygulama örneği gösterilmektedir. Eğitmen, div, class row, class col gibi temel grid bileşenlerini kullanarak bir sayfa oluşturmayı adım adım göstermektedir. Ayrıca, grid sisteminin mobil uyumluluğu test edilmekte ve farklı ekran boyutlarında nasıl davranacağı gösterilmektedir. Video, grid sisteminin temel kullanımını öğrenmek isteyenler için faydalı bir kaynak niteliğindedir.
- 00:01Grid Sistemi Uygulaması
- Bu videoda grid sistemi ile ilgili ilk çalışma yapılacak, geçen derste işin mantığı kabataslak anlatılmıştı.
- Grid sistemi için div oluşturuldu ve class row konteyner olarak adlandırıldı.
- Satır oluşturmak için class row kullanıldı ve sütun oluşturmak için class col-medi dört dört dört kullanıldı.
- 00:54İçerik Ekleme
- Sütunlara rastgele metin (lorem) eklendi.
- Her sütuna başlık olarak h1 etiketi eklendi ve "Merhaba Dünya" yazısı yerleştirildi.
- Her satırın sonuna buton eklendi ve class btn-info ve btn-lg kullanıldı.
- 02:39Düzenleme ve Mobil Uyumluluk
- Alt satıra geçme etiketi (br) eklendi ve konteyner içindeki içerikler ortalanmak için containerın başına align center eklendi.
- Mobil uyumluluk için ekran küçültüldü ve tablet ekranına geldiğinde içerikler alt alta gelmeye başladı.
- İçeriklerin arka planları değiştirilebilir, örneğin bg-dark kullanılabilir.