Moslashuvchan dizayn yaratish uchun qanday…

Media so'rovlar: CSS @media qoidalaridan foydalanish, qurilma xususiyatlariga (kenglik, ekran balandligi, orientatsiya va boshqalar) asoslangan holda uslublarni qo'llash.
```
/* Media so'rovi misoli */
@media (max-width: 600px) {
  .container {
    width: 90%;
  }
}
```

Moslashuvchan tarmoq tartibi (Flexible Grid Layout): nisbatli birliklar (%, vw, vh) va moslashuvchan xususiyatlar (flex, grid) yordamida maket yaratish.

/* Flexbox misoli */
.parent {
  display: flex;
  flex-wrap: wrap; /* Elementlar yangi satrga o'tishiga imkon beradi */
}

.child {
  flex: 1 1 200px; /* Elementning kengayishi, siqilishi va asosiy kengligi bo'lishiga imkon beradi */
}

Moslashuvchan rasmlar va media: CSS max-width xususiyatidan foydalanish, shunda rasmlar va boshqa media elementlar nisbatli ravishda o'sadi.

/* Moslashuvchan rasm misoli */
img {
  max-width: 100%; /* Rasm ota konteyner kengligini oshmaydi */
  height: auto;    /* Proportsiyalarni saqlaydi */
}

Mobil-First va Desktop-First:
- Mobil-First: Stil avval mobil qurilmalar uchun ishlab chiqiladi, so'ngra min-width Media Queries yordamida katta ekranlar uchun kengaytiriladi. Bu yaxshi amaliyot hisoblanadi, chunki u mobil qurilmalarning cheklangan resurslariga moslashtirishni soddalashtiradi va ishlashini yaxshilaydi.
- Desktop-First: Stil avval ish stoli uchun ishlab chiqiladi, so'ngra kichik ekranlar uchun max-width yordamida kamaytiriladi.
Xususiyatlarni aniqlash (Feature Detection): JavaScript yordamida brauzer yoki qurilma imkoniyatlarini aniqlash (masalan, touch-interfeysni qo'llab-quvvatlash) va mos uslublar yoki funksiyalarni qo'llash. Modernizr kabi asboblar yordam berishi mumkin.
Moslashuvchan tipografiya: Ekran o'lchamiga qarab shrift o'lchami va satr balandligini o'zgartirish, ko'pincha nisbatli birliklar (em, rem, vw) va Media Queries yordamida.
```
/* Moslashuvchan tipografiya misoli */
h1 {
  font-size: 2em;
}

@media (min-width: 768px) {
  h1 {
    font-size: 3em;
  }
}
```
Server tomonida aniqlash: qurilma yoki brauzer turini serverda aniqlash va mos versiyasini yuborish. Bu zamonaviy frontendda kamroq qo'llaniladi.

Moslashuvchan dizayn yaratish uchun qanday yondashuvlarni bilasiz?