对于media queries定义了许多媒体功能。
我想在 JavaScript 中读取浏览器的实际媒体功能值。我怎样才能做到这一点？
需要明确的是，我不想知道某些媒体查询是否匹配。例如，我想知道屏幕的物理宽度。与此类似的东西:
let width = window.getMediaValue("device-width", "cm");
最佳答案
每个设备都有自己的 dpi，JavaScript API 无法提供比 devicePixelRatio 更精确的信息。
devicePixelRatio Window 界面给你一个比例
指示渲染的页面是否应该缩放。
浏览器假定 devicePixelRatio 为 1 表示 96 dpi。我在自己的 17.3 英寸屏幕上进行了测试:
Math.sqrt(Math.pow(window.outerWidth / 96, 2) + Math.pow(window.outerHeight / 96, 2));
但它给了我 18.92 英寸，这是错误的。
然后我用了 online equation solver找出我屏幕的真实 dpi，它实际上是 105。
确实是我电脑上的结果
Math.sqrt(Math.pow(window.outerWidth / 105, 2) + Math.pow(window.outerHeight / 105, 2));
输出17.3
关于javascript - 如何读取浏览器的媒体功能？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34656089/