为什么background-size：cover在移动设备上的行为不同？

Question

我的背景尺寸有一个问题：在移动设备上覆盖（在移动Safari和android上测试）。

有时，当用户展开更多信息框时，网页的高度会发生变化。 每当在移动设备上发生这种情况时，背景图像实际上就会放大。而在台式机上则不会。

我工作围绕这一问题通过在CSS中加入“滚动”层，但是这引入了更多的问题。

关于如何解决此问题的任何建议，还是“可滚动”层是我唯一的选择？

我相信移动浏览器只是在调整背景，使其与网站最初以“扩展”大小加载时的外观相同，但是，在台式机上却没有这样做。

Answer 1

使用响应式设计可能会帮助您摆脱这些问题，该方法是为同时为台式机和移动设备创建网站的开发人员设计的。

我将举一个例子：

在CSS中，您可以：

@media screen and (max-width: 700px) {
.hide {
    display:none;
}}

在您的PHP / HTML中

<p class="hide"> tester 1234 </p>

当屏幕尺寸大于700px时，这些将使您显示文本；如果小于700px，则将消失。

我认为您现在应该可以为您的代码做一些修改，希望有帮助。