Как заставить браузер WVGA Android перестать масштабировать мои изображения?

Я разрабатываю HTML-страницу для отображения в браузерах Android. Рассмотрим эту страницу простого примера:

<html>
<head><title>Simple!</title>
</head>
<body>
<p><img src="http://sstatic.net/so/img/logo.png"></p>
</body>
</html>

Он выглядит просто на стандартных HVGA-телефонах (320x480), но на HDPI WVGA (480x800 или 480x854) встроенный браузер автоматически масштабирует изображение; это выглядит уродливо.

Я читал, что должен использовать этот тег, чтобы заставить браузер перестать масштабировать мою страницу:

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=0;" />

... но все, что делает, это отключить масштабирование пользователя (кнопки масштабирования исчезают); это фактически не мешает браузеру масштабировать мой образ. Корректировка масштабных коэффициентов (установка их всех на 2,0 или 0,5) не оказывает никакого эффекта.

Как заставить WVGA-браузер останавливать масштабирование моих изображений?

Ответ 1

А, нашел его, просмотрев исходный код Android. Там установлен новый Android-параметр target-densityDpi ", доступный в метатеге" viewport"; насколько я могу судить, он полностью недокументирован, кроме комментариев на регистрацию!

Поддержка добавления точек на дюйм для WebView.

В метатеге "viewport" вы можете указать "target-densityDpi" . Если он не указан, он использует значение по умолчанию 160dpi на сегодняшний день. Тогда 1,0 масштабный коэффициент, указанный в теге просмотра, означает 100% на G1 и 150% на Sholes. Если вы установите "target-densityDpi" на "device-dpi", то масштабный коэффициент 1.0 означает 100% как для G1, так и для Sholes.

Реализованный запрос Safari window.devicePixelRatio и css media Устройство-пиксельное соотношение.

Итак, если вы используете "device-dpi" и модифицируете css для размера шрифта и изображения src в зависимости от window.devicePixelRatio, вы можете получить лучшую страницу на Шолес /Passion.

Вот список параметров для "target-densityDpi" .

device-dpi: используйте выходные данные в качестве целевых dpi. с низким разрешением: 120 точек на дюйм medium-dpi: 160 точек на дюйм, что также является дефолтом на сегодняшний день с высокой разрешающей способностью: 240 dpi: Мы принимаем любое число от 70 до 400 в качестве допустимого целевого dpi.