如何指定图像大小，以便在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和Blackberry - 虽然不适用于Android - 通过在body标签上添加宽度和高度到图像的大小。移动浏览器将放大图像大小。