响应式设计 - 在iPhone和较小的浏览器上显示不同的网站

Question

我已经向my site here添加了一些媒体查询，这些查询在我将浏览器窗口最小化到最小尺寸时正确显示。虽然不幸的是，当我导航到其中一个内部页面时，原始设计显示在iPhone上。在浏览器中测试时，无论我在哪个页面，网站都能正常运行。

注意：要进行测试，请将浏览器最小化到最小宽度，以显示他们想要的“移动网站”。

我完全被这里难住了。有人可以指点我的方向，为什么iPhone似乎加载旧的CSS而浏览器本身加载当前的CSS？

谢谢！

Answer 1

确保包含这样的视口元标记：

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

Answer 2

  

在浏览器本身加载当前的CSS时，有人可以指点我为什么iPhone似乎在加载旧的CSS吗？

你可能会回答你自己的问题。这绝对是一个缓存问题，因为我在移动设备和桌面浏览器上都看到了相同的网站。

尝试清除移动浏览器的缓存。如果您使用Safari，请转到设置＆gt; Safari＆gt;清除Cookie和数据。如果您使用Chrome或任何其他第三方浏览器，通常可以清除应用内设置页面下的本地文件。