29

aspect-ratio和之间的简单术语有什么区别device-aspect-ratio

4

5 回答 5

42

对于对目标显示区域输出设备在纵横比方面的差异感到困惑的每个人:

目标显示区域

浏览器窗口的纵横比或显示网站的区域(特殊情况是嵌入式网站)

输出设备

屏幕的物理纵横比。例如您的智能手机或桌面显示器

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

我希望它有所帮助。

于 2013-09-05T02:20:02.470 回答
5

移动设备上的一个功能差异是软键盘出现会改变纵横比,但不会改变设备纵横比。

于 2016-10-30T18:53:57.697 回答
3

aspect-ratio

描述输出设备的目标显示区域的纵横比。此值由两个用斜杠 ("/") 字符分隔的正整数组成。这表示水平像素的数量超过垂直像素的数量。

来源

device-aspect-ratio

描述输出设备的纵横比。此值由两个用斜杠 ("/") 字符分隔的正整数组成。这表示水平像素的数量超过垂直像素的数量。

来源

于 2011-04-20T05:21:59.447 回答
3

纵横比测量视口区域。设备纵横比测量设备屏幕面积。

于 2016-11-19T14:41:10.240 回答
0

纵横比

视口纵横比或设备纵横比是宽度与高度的比率。因此,如果屏幕为 1,000 像素宽和 500 像素高,则设备纵横比将为 2:1,因为 1,000 是 500 的两倍。屏幕的比例差异很大,尽管乍一看它们几乎都只是看起来像一个类似的矩形。

常见的显示器纵横比为 16:9(如 1920 × 1080 或 1366 × 768 像素)或 16:10(1280 × 800)。iPhone 3 和 4S 为 3:2(480 × 320 和 960 × 640),iPhone 5 为 16:9(1136 × 640)。Android 手机通常为 4:3、3:2、16:10 或 16:9。

例子:

@media only screen and (device-aspect-ratio: 16/9)
{ ... }
@media only screen and (min-device-aspect-ratio:
1920/1080) { ... }
于 2014-10-07T09:14:27.890 回答