Utilore

屏幕分辨率

页面顶部就是浏览器报告的屏幕分辨率。下面依次是实际像素数、解释两者差别的像素密度、宽高比、刷新率和浏览器窗口大小。改变窗口大小，数字会跟着变。

下面的数据全部由你自己的浏览器读出。改变窗口大小，数字会跟着变。

— 屏幕（CSS 像素）

屏幕（实际像素）
—
像素密度
—
宽高比
—
百万像素
—
页面可视区
—
浏览器窗口
—
色深
—
刷新率
—
方向
—

这里的任何内容都不会外传：页面读取的是你自己的浏览器，并把读到的告诉你。刷新率也是这个原因才靠数半秒钟的帧来测量，而不是直接询问——浏览器并不提供这个数据。

相关工具： 键盘测试, 麦克风测试, 摄像头测试, 我的 IP 地址查询

使用方法

  1. 最大的那个数字是以 CSS 像素计的屏幕尺寸——浏览器就是按这个单位工作的。
  2. 「屏幕（实际像素）」是这个数字乘以像素密度。显示器包装盒上印的就是它。
  3. 「页面可视区」才是网页真正拿到的空间：窗口减去工具栏和滚动条。网站问你用多大分辨率浏览时，要的就是这个数。
  4. 改变浏览器窗口大小，或者把手机横过来，看看哪些数字会变、哪些不会。

实用说明

为什么浏览器说 390×844，盒子上却写 1170×2532

因为两者数的不是同一样东西。浏览器报告的是 CSS 像素，一种表示视觉大小的单位，好让文字在各种屏幕上都保持可读；盒子上数的是面板里的物理点。现在的手机屏幕把三个物理点塞进一个 CSS 像素，这正是像素密度那一行的含义——密度为 3 时，宽 390 的屏幕实际有 1170 个点。在电脑上，同样的效果来自显示缩放：把 Windows 设成 125%，一台 1920 像素的显示器就会向浏览器报告 1536。两个数字都是真的，只是回答的问题不同。

三种尺寸，你要的是哪一个

屏幕指的是整块显示器。浏览器窗口比它小——不含系统自己占去的部分——而在 Windows 上最大化时，它反而比屏幕大出几个像素，因为窗框超出了边缘。页面可视区更小，因为工具栏、标签栏和滚动条都在往里挤。网站或设计师问「你的分辨率」时，一般指屏幕；而当页面显示不正常、有人问你在多宽的范围内浏览时，指的是页面可视区。

刷新率是测出来的，不是问出来的

浏览器并不提供刷新率，所以这个页面靠数半秒钟内能画多少帧来推算。结果会取最接近的常见值：原始测得 59.7 其实就是一块 60 Hz 屏幕加上测量噪声，直接显示 59.7 等于把噪声当成事实。如果标签页在后台或机器很忙，测出来会偏低；有些笔记本还会为省电主动降低刷新率——数字看着不对就刷新页面重测。

常见问题

我的屏幕分辨率是多少？

就是本页顶部那个数字，单位是 CSS 像素——那是你的浏览器看到的。真正的物理分辨率在下一行，如果两者不同，像素密度那一行会说明差多少。

为什么我的 4K 显示器显示 2560×1440？

因为显示缩放。在 150% 缩放下，3840 像素的显示器会向应用程序报告 2560，好让文字和按钮不至于只有原本三分之一大。面板仍然是 3840 个点，「实际像素」那一行显示的就是它。

缩放页面会改变页面可视区吗？

会，而且本该如此：缩放改变的是屏幕上能装下多少 CSS 像素。放大后，页面可视区按 CSS 像素算会变小，尽管窗口一动没动。屏幕那一行不会变。

刷新率看着不对。

把这个标签页放到前台再刷新页面。浏览器会限制后台标签页的动画，所以你在别处时测出来的值会偏低。有些笔记本用电池时也会降低刷新率，这种情况下数字是对的，屏幕确实变慢了。

这些数据会被发送到什么地方吗？

不会。本页上的一切都是从你自己的浏览器读出来再显示给你的。不会发到服务器，不保存，也不记录，而且断网也能用。

相关工具