Въведение в оформлението за различни екрани в CSS

В съвременния свят един сайт трябва да се показва добре на устройства с различни размери на екрана.

Обикновено устройствата се разделят на четири класа: настолни компютри (desktop), лаптопи, таблети (tablet) и телефони (mobile).

Преди, в древни времена, бяха известни популярните размери на екраните на всички устройства, защото те не бяха толкова много. И сайтовете се правеха така, че да се показват коректно на известен списък с резолюции.

В настояще време устройствата станаха толкова много, че е невъзможно да се състави списък с резолюции, за които трябва да се прави сайт. Сега се счита, че оформлението трябва да се показва коректно на екран с всякакъв размер.

Това се постига чрез пренареждане на блоковете в ключови точки на оформлението. При това тези ключови точки се избират не за определени устройства, а за съдържанието на сайта - така че то да изглежда добре.

Между ключовите точки ширината на елементите на сайта трябва да е плаваща, за да се нагласява спрямо ширината на екрана. А в ключовите точки се извършва пренареждане на блоковете в други позиции.

Описането оформление се нарича адаптивно или отзивчиво (responsive). С изследването му ще се занимаем в следващите уроци.