Turli xil ekranlar uchun CSS da veb-sahifa dizayni

Zamonaviy dunyoda veb-sayt turli xil ekran o'lchamlariga ega qurilmalarda yaxshi ko'rinishi kerak.

Odatda qurilmalar to'rt sinfga ajratiladi: kompyuterlar (desktop), noutbuklar, planshetlar (tablet) va telefonlar (mobile).

Ilgari, qadimgi davrlarda, barcha qurilmalarning mashhur ekran o'lchamlari ma'lum edi, shuning uchun ham ular unchalik ko'p emas edi. Va saytlar ma'lum ro'yxatdagi o'lchovlar uchun to'g'ri ko'rinishini ta'minlash uchun qilingan.

Hozirgi vaqtda qurilmalar shunchalik ko'payib ketdiki, sayt qilish uchun kerakli o'lchovlar ro'yxatini tuzishning iloji yo'q. Hozir hisoblanadiki, veb-dizayn har qanday o'lchamdagi ekranda to'g'ri ko'rinishi kerak.

Bunga maketning kalit nuqtalarida bloklarni qayta joylashtirish orqali erishiladi. Bunda ushbu kalit nuqtalar ma'lum qurilmalar uchun emas, balki sayt kontenti uchun tanlanadi - shunday qilib u yaxshi ko'rinsin.

Kalit nuqtalar orasida sayt elementlarining kengligi ekran kengligiga moslashishi uchun suzuvchi bo'lishi kerak. Kalit nuqtalarda esa bloklar boshqa joylarga qayta joylashadi.

Tasvirlangan veb-dizayn adaptiv yoki responsiv (responsive) deb ataladi. Uni o'rganish bilan biz keyingi darslarda shug'ullanamiz.