某些网站图片在iPhone上无法正常显示

我开发了一个响应式网站，当我认为它完美并准备启动时，我发现主页上的图像无法在iPhone上正确显示（我开发的该网站同时在Android上进行测试，所以直到现在我才对智能手机有所了解）。图像应该适合屏幕的宽度（我已经设置了最大宽度：100％;在它们上面），但是相反，它们被拉伸并像素化的方式超出了它们的实际分辨率。某些网站图片在iPhone上无法正常显示

奇怪的是，网站上任何其他页面上的图像都显示得很好。我认为这个问题的根源在于，主页上的图像实际上是通过CSS背景属性设置的，而其他地方的图像则设置在HTML中的<img>标签中。因此，我在CSS文件中注释了“背景”声明，并在主页上使用<img>标签，就像在其他地方一样。当我把它做到第一张图像时，它表现出色。但是，只要我将其余的图像切换为HTML格式，它们都会恢复到以前出现的丑陋状态。

我的老板（谁有权访问一个iPhone）给我发了这个视频（因为道歉是失焦的，但你的想法）：https://www.youtube.com/watch?v=_vFJVZiBc3Q

第一四象他滚动过去应该都适合在折叠之上，你只能看到实际图像的左边1/10，这就是它伸出的距离。

我在这里没有想法。有什么特别的我需要为iPhone做些什么？使用<img>标签，这些照片应与其他工作图像的格式相同。

非常感谢！

来源

2014-09-01 Pete

和你的代码是..... – Devin 2014-09-01 22:58:57

这是关于代码！有很多东西需要检查，比如viewport meta元素等。这就像得到医生的诊断。你不会给他发一个视频。 :-) – 2014-09-01 23:01:32

我玩过视口meta元素。目前它只是''，但是添加max-scale = 1.0并没有解决任何问题。这是一个WordPress的网站，但我只是一直在玩HTML/CSS文件，并且据我所知，我在主页中声明“”的方式与我如何在主页中声明它们没有区别该网站的其余部分。我还有其他相关信息吗？再次感谢！ – Pete 2014-09-01 23:55:28

事实证明，这是一个特定于我的问题。对于上述含糊不清的道歉，我真的不知道我在iPhone上应该寻找什么。有问题的图像包含在<div> s中，其中我以vh为单位指定了一个高度。作为任何人阅读这篇文章的未来参考，你显然不应该那样做。将高度更改为百分比单位解决了问题，并且它在Android和iPhone上都很棒！

来源

2014-09-02 06:54:43 Pete

某些网站图片在iPhone上无法正常显示

回答

相关问题