Как указать размер изображения, чтобы он масштабировался до 100% ширины в браузерах iPhone и Android?

Question

Я занимаюсь разработкой своего первого мобильного сайта.Дизайн довольно прост - почти нет графики.Есть страница, которая позволяет пользователям искать пенсионные сообщества по почтовому индексу.Страница результатов поиска - это просто список найденных сообществ со ссылками, чтобы открыть для каждого отдельную страницу сообщества.

Все рабочие файлы, КРОМЕ ... теперь клиент хочет разместить изображение каждого сообщества на определенной странице этого сообщества.Изображение должно занимать всю ширину экрана, независимо от того, просматривает ли пользователь в портретном или альбомном режиме, и оно должно работать одинаково в обоих браузерах iPhone и Android.размер изображения, чтобы он работал таким образом?

Отредактировано для добавления: у меня уже есть тег области просмотра, но хотя он правильно устанавливает размер текста и элементы HTML / css, он не оказывает никакого влияния на изображения.

Answer 1

      <img src="source" width="100%" />

или

     <img src="source" style="width:100%" />

или

 <style>
  .full
  {
  width: 100%;
  }
  </style>
 <img src="source" class="full" />

должны выполнять работу;

Answer 2

Попробуйте использовать

.img {
    max-width: 100%;
}

Answer 3

Попробуйте это;Кажется, что он работает для iPhone и Blackberry - не очень хорошо для Android - добавляя ширину и высоту тега body к размеру изображения.Мобильные браузеры затем увеличат изображение до размера.