如何修复移动 Safari 上的背景大小：封面问题？

CSS 背景大小：移动 Safari 的封面替换

移动 Safari 关于 CSS 属性背景大小的意外行为：封面已提示需要替代解决方案。此问题表现为图像无法完全覆盖 iOS 设备上各自的 div。

解决方案：

要解决此问题，需要覆盖默认的背景附件：移动设备上的固定属性。通过设置背景附件在针对 iPhone 的媒体查询中滚动，背景图像将重新获得其所需的行为：

.section {
  background-size: cover;
  background-attachment: scroll; /* Override fixed attachment */
}

@media (max-width: @iphone-screen) {
  .section {
    background-attachment: scroll;
  }
}

注意：变量 @iphone-screen 应该是预定义的。

通过实施此解决方案，背景图像将无缝覆盖整个 div，无论其内容的宽度或高度如何。 background-size: cover 属性现在按预期运行，在 Mobile Safari 上提供一致且具有视觉吸引力的体验。

以上是如何修复移动 Safari 上的背景大小：封面问题？的详细内容。更多信息请关注PHP中文网其他相关文章！