如何指定图像大小，使其在 iPhone 和 Android 浏览器上缩放至 100% 宽度？

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 和黑莓——但对 Android 来说不太好——通过在 body 标签上添加宽度和高度来调整图像的大小。然后，移动浏览器将放大图像尺寸。