Как сверстать сайт, чтобы он сжимался под любое разрешениие?

Question

[Филипп Гаврилов]

Возьмем, допустим, сайт Эппл. На мониторе 1920х1080 он выглядит так:



Открывая его на 1366х786 увидим обрезанные поля справа, слева и снизу, соответственно:



Задача состоит в том, чтобы сайт даже на разрешении 1366х786, открывался бы без обрезок, просто в "сжатом" виде. Чтобы пропорционально уменьшилось всё, включая шрифты и картинки:



Как это можно реализовать в принципе?
Как это можно быстро реализовать, если сайт уже сверстан в px?

Comments

[Алексей Струков]

Реализовать можно, но только зачем?
Будет на телефоне размер шрифта 5 пикселей и кнопочки размером 10 пикселей.
Или наоборот при больших разрешениях шрифт станет огромным.

Answer 1

[Vladimir Yamshik]

Почитайте про адаптивный и отзывчивый дизайн. Совет почитайте книгу "Отзывчивый веб-дизайн" Итан Маркотт (в этой книге как раз написано как реальзовать уже готовый сайт)

Answer 2

[iBrm1269]

Адаптивный дизайн что такое почитайте

Answer 3

[Michael Peteichuk]

Есть готовый фреймворк Bootstrap www.oneskyapp.com/ru/docs/bootstrap , но если идет речь о верстке, то только использовать меди запросы media query, вбить это в поиск и по первым ссылкам поискать.

Answer 4

[Kiska228]

Попробуй scale в jquery.