Flexbox ve Grid
Tek ve iki boyutlu düzen ihtiyaçlarına göre Flexbox veya Grid seçip hizalama yapma.
Tahmini süre: 50 dakika
Ders kartı
Sınıf: 11. sınıf Ders: Web Tabanlı Uygulama Geliştirme Ünite: CSS ve Etkileşim Konu: Flexbox ve Grid Dersin amacı: Tek ve iki boyutlu düzen ihtiyaçlarına göre Flexbox veya Grid seçip hizalama yapma. Ders sonunda: • Flexbox kavramını doğru bağlamda açıklarsın. • Grid, alignment, gap arasındaki ilişkiyi bir örnekle gösterirsin. • Uygulamayı normal, sınır ve hatalı durumlarla test edersin. • Çalışmanı kısa bir kanıt veya ekran görüntüsüyle sunarsın.
Konu anlatımı
Tek ve iki boyutlu düzen ihtiyaçlarına göre Flexbox veya Grid seçip hizalama yapma. Anahtar kavramlar: Flexbox, Grid, alignment, gap. Bu konuyu öğrenirken önce “Flexbox” kavramının neyi çözdüğünü belirle; ardından Grid, alignment, gap kavramlarıyla ilişkisini bir örnek üzerinde göster. Ezber yerine neden–sonuç ilişkisi kur: hangi girdi alınır, hangi karar verilir, hangi çıktı veya kanıt beklenir? Ders sonunda konuyu kendi cümlenle açıklayabilmeli, küçük bir örnek üzerinde uygulayabilmeli ve sonucu ölçülebilir bir testle doğrulayabilmelisin.
11. sınıf bilişim laboratuvarı
Web Tabanlı Uygulama Geliştirme dersi için kavramları gerçek bir üretim ortamıyla ilişkilendiren ders görseli.
<form>
<label for="email">E-posta</label>
<input id="email" name="email" type="email" required>
<button type="submit">Gönder</button>
</form>Bu konunun testi
Öğrenci hesabınla giriş yaparak sonucu ve açıklamalı geribildirimi kaydedebilirsin.