在部分手机浏览器中，为何"aspect-ratio: 1 / 1"样式无效？

发布日期： 2024-10-23 阅读量： 作者： 网络

在部分手机浏览器中，为何

如何在部分手机浏览器中解决aspect-ratio: 1 / 1样式无效问题？

“aspect-ratio: 1 / 1”样式在某些移动设备（如 iphone x 和部分安卓机）中无效的问题困扰着许多开发者。

为了解决此兼容问题，您可以采用以下回退方案：

.container {
  width: 100%;
  padding-top: 100%; // 设置容器的 padding-top 为高度的 1%
}

在部分手机浏览器中，为何&quot;aspect-ratio: 1 / 1&quot;样式无效？