网页仅覆盖移动设备的半屏

Question

我创建了一个网页，该网页在笔记本电脑上看起来不错，但在其他屏幕尺寸（包括手机）上均无法使用。下半部分始终为白色。我所有的页面上都有这个问题，但是出于明显的原因，我只允许访问一个页面（search.php）。

我在底部图片上尝试了不同的定位，例如。位置：绝对和相对。我已经使用vh而不是px或％使文本半响应。

在线页面@ http://faceygrad.elementfx.com/search.php 找到CSS：http://faceygrad.elementfx.com/other.css

我希望页面填满整个屏幕。如果需要以某种方式在移动设备上放大，那就这样吧。

谢谢！

Answer 1

将meta标签添加到您的head元素以供移动使用：

CaptureLogger customLogger = (CaptureLogger) LogManager.getLogger(ClassUnderTest.class);

然后添加位置：固定；移至页面底部的图片。 快速修复，如果您不想让一切都变得移动友好。

Answer 2

如果Anton的答案不起作用，请检查页边距，代码是否正确，@ media参数是否正确，然后考虑对CSS中的元素（而不是固定pix或em）使用带有％的流畅设计。找出问题的最佳方法是使用chrome，按f12键进入移动视图，然后从右侧的代码中查看问题出在哪里，或者布局您的屏幕。