Duyduğunuz duyarlı tasarım yaklaşımları nelerdir…

Medya Sorguları: CSS @media kurallarını kullanarak cihaz özelliklerine (genişlik, ekran yüksekliği, yönlendirme vb.) göre stiller uygulama.
```
/* Medya Sorgusu Örneği */
@media (max-width: 600px) {
  .container {
    width: 90%;
  }
}
```

Esnek Izgara Düzeni (Flexible Grid Layout): Görevleri göreceli birimler (%, vw, vh) ve esnek özellikler (flex, grid) kullanarak düzen oluşturma.

/* Flexbox Örneği */
.parent {
  display: flex;
  flex-wrap: wrap; /* Öğelerin yeni satıra geçmesine izin verir */
}

.child {
  flex: 1 1 200px; /* Öğenin genişlemesine, daralmasına ve temel genişliğe sahip olmasına izin verir */
}

Esnek Resimler ve Medya: Resimlerin ve diğer medya öğelerinin orantılı olarak ölçeklenmesi için CSS max-width özelliklerinin kullanılması.

/* Esnek Resim Örneği */
img {
  max-width: 100%; /* Resim, ebeveyn konteyner genişliğini aşmayacak */
  height: auto;    /* Oranları korur */
}

Mobil-İlk vs. Masaüstü-İlk:
- Mobil-İlk: Stil önce mobil cihazlar için geliştirilir ve daha büyük ekranlar için min-width Media Queries kullanılarak genişletilir. Bu, sınırlı kaynaklara sahip mobil cihazlar için stilizasyonu basitleştirdiği ve performansı artırdığı için iyi bir uygulamadır.
- Masaüstü-İlk: Stil önce masaüstleri için geliştirilir ve küçük ekranlar için max-width Media Queries kullanılarak küçültülür.
Özellik Tespiti (Feature Detection): JavaScript kullanarak tarayıcı veya cihazın özelliklerini belirleme (örneğin, dokunmatik arayüz desteği) ve buna uygun stiller veya fonksiyonlar uygulama. Modernizr gibi araçlar yardımcı olabilir.
Duyarlı Tipografi: Ekran boyutuna bağlı olarak yazı tipi boyutunu ve satır yüksekliğini değiştirme, genellikle göreceli birimler (em, rem, vw) ve Media Queries kullanılır.
```
/* Duyarlı Tipografi Örneği */
h1 {
  font-size: 2em;
}

@media (min-width: 768px) {
  h1 {
    font-size: 3em;
  }
}
```
Sunucu Tarafı Tespiti: Sunucuda cihaz veya tarayıcı türünü belirleme ve uygun sayfa veya stilleri gönderme. Modern frontend geliştirmede daha az yaygındır.

Duyduğunuz duyarlı tasarım yaklaşımları nelerdir?