CSS Media Query Fixer Tool - подход, ориентированный на мобильные устройства [Техническая задолженность] [Устаревший код] - PullRequest
0 голосов
/ 27 мая 2020

TLTR : Нужен инструмент, который может заменять большие CSS с помощью объявления стилей сначала на рабочем столе на объявление стилей сначала для мобильных устройств

Пояснение : У меня есть друг, у которого нет большого опыта работы с CSS. Он создал для меня страницу. Создал HTML и CSS для десктопа, но не создал мобильную версию. Затем я попросил его добавить мобильную версию.

Обычно, когда мы говорим о хорошем использовании медиа-запроса - мы должны установить все стили по умолчанию для мобильных устройств, затем обработать следующее, большее разрешение с медиа-запросом, затем следующее разрешение ... эт c. Стиль, который не нужно менять, в следующей резолюции не упоминается. Это позволяет иметь красивые, маленькие CSS.

.topnav {
}
@media screen and (max-width: 600px) {
  .topnav {
  }
}
@media screen and (max-width: 800px) {
  .topnav {
  }
}

Я ожидал, что это очевидно. Я ошибался. Между тем CSS становится все больше и больше. Был добавлен новый медиа-запрос, и все было прекрасно, пока я не понял, что .... CSS огромен, тяжел, и каждый набор стилей для определенного разрешения является копией более низкого разрешения с некоторыми хитрыми изменениями. Теперь это очень сложно оптимизировать, сложно изменить, но легко сделать ошибку. Чтобы перевернуть его вручную, мне потребуется много работы.

...