如何处理响应式设计和iPad / iPhone

Question

我正在努力应对响应式设计。

所有内容都按百分比调整大小，并且开始在“常规”屏幕上按预期工作。

通过javascript我确定窗口宽度和高度，它设置背景图像。 背景图片使用css3“cover”属性。

但是在iPad / iPhone上，一切显然都在搞乱。 当pagecontent溢出页面高度（大多数页面执行，并且应该这样）时，“cover”属性显然会扩展并显示图像太大。 高度和边缘顶部突然设置得太高了。

我的猜测是iPhone / iPad正在考虑整个内容，包括溢出的内容作为整页高度，而不仅仅是实际的可见屏幕....但我不知道如何处理它。

另外，当我提醒窗口宽度时，我得到：iPad，iPhone4和iPhone3上的980。我想在iPhone / iPad上我不能使用窗口宽度......？

如何处理移动设置？

我希望我不需要创建iPhone / iPad特定设置......但我开始担心我需要这样做？

以下是设计的游乐场：http://basix.popweb.dk

任何帮助或建议？

THX 约翰

Answer 1

好吧，我刚刚在iPhone上检查了你的网站，看起来好像加载了，但布局似乎没有响应我。

无论如何，您使用的是CMS吗？

另外，在我学习材料时，我建议你检查http://themble.com/bones/ 即使它是一个wordpress主题，样式表也很好地解释了什么是有效的。然而，它使用SASS或LessCSS（CSS预处理器），我建议学习，因为它将为您节省大量编写CSS的时间。这根本不难，我在大约2小时内学会了LessCss http://lesscss.org/。