Как заставить браузер Android не изменять ширину области просмотра при увеличении / уменьшении? - PullRequest
1 голос
/ 08 января 2012

Хотелось бы узнать, как заставить браузер Android (предпочтительно с использованием чистого CSS3) не изменять ширину области просмотра, когда пользователь увеличивает / уменьшает изображение пальцами?

У меня несколько медиа-запросов на страницестремление к разной ширине области просмотра.Но каждый раз, когда пользователь увеличивает или уменьшает ширину области просмотра страницы, макет страницы переупорядочивается, и этого не происходит.Я хочу, чтобы браузер Android «запомнил» свой начальный размер области просмотра, а когда пользователь увеличивает / уменьшает масштаб, я хочу, чтобы браузер Android просто увеличивал масштаб, но не изменял размер области просмотра.

Возможно ли это с помощью CSS?Спасибо за любую помощь заранее.

РЕДАКТИРОВАТЬ: Мои медиа-запросы:

@media only screen and (min-width : 800px) and (max-width : 999px) {
  #content { width:800px; }
}
@media only screen and (max-width : 799px) {
  #content { width:600px; }
}

Ответы [ 2 ]

4 голосов
/ 21 января 2012

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

Например, если вы хотите установить ширину области просмотра равной 600px, вы бы включили эту строку в свойHTML <head>:

<meta name="viewport" content="width=600px">

Затем можно установить ширину других элементов на странице, зная, насколько она будет пропорциональна области просмотра.Например, этот элемент будет занимать всю ширину мобильного браузера:

#content {
   width: 600px;
}

Вместо того, чтобы масштабировать содержимое, чтобы соответствовать области просмотра, вы можете масштабировать область просмотра, чтобы соответствовать содержимому.

0 голосов
/ 20 января 2012

Я бы рекомендовал использовать другой подход и использовать адаптивную / адаптивную тему с установленным пределом масштабирования.

...