Какие медиазапросы CSS лучше для сайта с экранами с высотой 100hv?

Был ли у кого опыт верстки сайтов с поэкранной прокруткой секций? Подразумевается, что на всех устройствах высота каждой секции всегда равна высоте экрана. Знаю, что идея сомнительная (особенно для мобильных), когда речь идет не о сайте с секциями из фона, тайтла и параграфа. Но, представим, что есть такая задача, где в каждой секции имеется определенный контент в достаточном объеме, который надо вместить на любой экран без обрезки.

Условно можно взять большие и средние мониторы ПК; планшеты и смартфоны в двух ориентациях. Стоит ли использовать комбинированные запросы вроде:
@media (max-width: 1280px) and (max-height: 640px) {}
@media (max-width: 767px) and (max-height: 480px) {}


Также по идее нужно учитывать ориентацию планшетов и мобилок:
@media (max-width: 1024px) and (orientation: landscape) {}
@media (max-width: 1024px) and (orientation: portrait) {}
@media (max-width: 767px) and (orientation: landscape) {}
@media (max-width: 767px) and (orientation: portrait) {}


Как бы вы подошли к такому проекту, какие бы запросы использовали для потенциального уменьшения объема кода и человекочасов верстки?
  • Вопрос задан
  • 48 просмотров
Пригласить эксперта
Ответы на вопрос 1
xmoonlight
@xmoonlight
https://sitecoder.blogspot.com
Но, представим, что есть такая задача, где в каждой секции имеется определенный контент в достаточном объеме, который надо вместить на любой экран без обрезки.
Вы что курите?!))

Самый простой вариант: text-overflow
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы