HTML / CSS: как запретить браузерам Android и iPhone масштабировать фоновые изображения

Question

У меня проблема в мобильных браузерах с использованием медиа-запросов в сочетании с фоновыми изображениями

<meta name="viewport" content="width=device-width" />

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

Я хочу, чтобы все браузеры представляли каждый элемент страницы в масштабе 1: 1.

Как сделать так, чтобы медиа-запросы работали, нозапретить браузеру масштабировать фоновые изображения на странице.Короче говоря, я хочу, чтобы страница обрабатывалась так же, как в настольном браузере.

Те же проблемы возникают в браузерах Android и iPhone.

Answer 1

Вы пытались использовать фиксированное background-size свойство, например. background-size:100px 100px;

Answer 2

Да, вы должны использовать масштабирование в вашем метатеге:

<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />