html - 为什么这些图片无法在移动设备上加载？ - HTML/CSS

Question

关于 this页面，图像在桌面上看起来不错，但在移动设备上是白色的/找不到。我不知道为什么会这样。我只是调用一个 img 标签，但它说它在移动设备上找不到，即使它在那里

Answer 1

我检查了你的文件，@MrVimes 是正确的，你应该完成你的 html，这将有助于在较慢的设备上更好地验证。

然而，问题完全在于图像的大小。 Chrome 开发工具向我展示了它们的大小，启用模拟器并选择 iPhone 5，看看会发生什么。只是需要很长时间才能下载。

尝试使用 Picturefil.js在您的软件应用程序中提供较小的图像或使它们更小。

这是我从 Google Dev Tools 得到的图片(免费而且很棒):

我还注意到，如果您打开开发工具，您需要更改图像在 CSS 中的处理方式:

Position:center

无效，可以根据您希望页面结构的外观将其设置为相对或静态。

我还看到你可能想用这个 css 更新你的标题:

z-index: 99999;

这将使您的标题出现在顶部，因为 z-index 会更改 html 元素的层(很像三明治中的填充物)