css - CSS 媒体查询中纵横比和设备纵横比的区别

Question

简单来说，aspect-ratio 和 device-aspect-ratio 有什么区别？

Answer 1

对于那些对目标显示区域和输出设备之间在宽高比方面的区别感到困惑的人:

目标展示区域

Aspect ratio of your browser window or the area your website is displayed on (a special case would for example be an embedded website)

输出设备

Physical aspect ratio of the screen. E.g. of your smartphone or desktop display

由于智能手机和平板电脑通常只以全屏模式显示应用程序，因此 aspect-ratio 和 device-aspect-ratio 是相同的。在台式计算机上，情况并非总是如此，因为用户可以调整浏览器窗口的大小，从而改变纵横比。

希望对你有帮助。