Какие существуют размеры экранов?

Question

[Иван Погорелов]

Я сейчас делаю сайт с адаптивной версткой. С библиотеками экспериментов мне уже хватило. пользуюсь чистым css. но так придется задавать размеры, при которых подключается css ручками. У меня пять файлов: смартфоны, планшеты, небольшие мониторы, большие мониторы, и общий. Ну в общем сам вопрос: какие размеры задавать, для каждого из 4 стилей?

Answer 1

[Сергей Протько]

пользуюсь чистым css

лучше нечистые less/scss

Намного проще не париться о разных девайсах. Девайсов много. Есть телефоны с экраном как у планшета и планшеты с экраном как у телефона. Есть любители повернуть монитор на 90%, есть умные часы с браузерами, есть микроволновки с браузерами...

То есть берем браузер и ресайзим окно... и смотрим на каком разрешении все плохо а на каком хорошо. Перестраиваем элементы дойдя до какого-то порога. Размеры все же от дизайна и задачи задаются.

Answer 2

[Юлия YuKi]

+100, ответ на ваш вопрос: экраны бывают разные и на всех смотреться должно в идеале хорошо, так что берем браузер и ресайзим, где ломается - делаем breakpoint - да, минус в том, что в разные файлы вы это не разнесете, но берите препроцессор в руки и вперед - там удобно все прописывается прямо в лесенку.

Answer 3

[Назар Мокринский]

А ещё почитайте про то, что такое viewport, и почему на мобильных устройствах 1px это не то, что вы могли себе подумать.

Answer 4

[Дима Паутов]

Вот ответ!

Answer 5

[zooks]

Я использую три размера для CSS media:

$small: 0; //480px and below
$medium: 30em;
$large: 48em;

Можно еще добавить
$extralarge: 75em;

Answer 6

[Сергей]

quirktools.com/screenfly
вводите свой адрес сайта, вплоть до того что можно localhost
и сразу в менюшке размерчики

Answer 7

[Hovhannes Sargsyan]

>>>>> Какие существуют размеры экранов?

Уже любые, просто надо делать так что бы везде смотрелся хорошо, в Firefox-e нажимаешь ctrl+shift+M, и начинаешь ресайз. )))