CSS - aspect-ratio:在Safari浏览器中不工作

Question

​

.test {
    width: 20%;
    background: red;
    aspect-ratio: 1/1;
}

<div class="test"></div>

​

aspect-ratio: 1/1;它可以在除safari之外的其他浏览器中正常工作。但此代码在Safari中不起作用。我使用的是macOS 11.2。我现在已经更新到macOS 11.5.2。据我所知，它支持safari，但我不能完全理解这个问题。从现在开始谢谢你。如果有任何遗漏的信息，我会添加它，如果你让我知道。

Answer 1

在Safari15之前的Safari中不支持宽高比作为css属性，但支持使用宽高比@media: (aspect-ratio: 1/1)的媒体查询：https://caniuse.com/?search=aspect-ratio