💻

设备信息

展示当前浏览器的操作系统、屏幕分辨率、视口尺寸、设备像素比、CPU 核心数、GPU 与运行时信息,支持一键复制用户环境信息,适合前端兼容性排查、响应式断点调试、用户环境信息收集与线上问题复现环境核对。

Loading device info…

关于 设备信息

调试响应式布局或排查兼容问题时,你常想一眼看清当前设备的屏幕尺寸、像素比、视口大小、浏览器和系统等信息。本工具在浏览器本地读取并展示这些运行时参数:屏幕分辨率与可用区域、devicePixelRatio、视口宽高、色深、时区、语言、是否触摸屏等,全部来自浏览器自身 API。数据仅在你的页面里显示,不会被收集或上报。 建议在日常开发中收藏本工具,遇到相关 Web 开发需求时即可快速打开使用。所有处理均在浏览器本地完成,无需安装任何软件。

使用场景

  • 响应式调试 — 实时查看视口宽高和像素比,对照断点确认媒体查询是否按预期生效。
  • 高清适配 — 读取 devicePixelRatio,判断是否需要为 Retina 屏提供 2x、3x 图。
  • 环境取证 — 让用户截图设备信息页,快速收集复现 bug 所需的环境参数。
  • 触摸检测 — 确认设备是否支持触摸,决定是否启用手势或悬停降级方案。
  • 时区语言 — 核对浏览器报告的时区和语言,排查本地化和日期显示问题。

常见问题

screen 尺寸和视口尺寸为什么不一样?

screen.width/height 是整块屏幕的物理分辨率,而 innerWidth/innerHeight 是浏览器可视区域(视口),后者会因地址栏、缩放和窗口大小而变小。

devicePixelRatio 是什么意思?

它是物理像素与 CSS 像素的比值。比如 Retina 屏为 2,表示一个 CSS 像素由 2x2 个物理像素绘制,决定了你是否要准备高清切图。

这些信息能唯一标识我吗?

单项不能,但多项组合(屏幕、字体、时区等)可形成浏览器指纹。本工具只在你本地展示、不做任何采集,请放心。

为什么读到的某些字段是空或受限?

出于隐私,现代浏览器对部分能力做了收窄,如电池、精确机型等可能不可用或需权限,读到 undefined 属正常。

旋转手机后数值会更新吗?

会。视口宽高、orientation 等会随旋转或窗口缩放变化,本工具监听 resize 事件实时刷新显示。

有浏览器兼容性要求吗?

本工具兼容所有现代浏览器(Chrome、Firefox、Edge、Safari),无需安装任何插件或扩展。

可以离线使用吗?

首次加载后,部分功能在离线状态下仍可使用。页面资源加载后,核心逻辑完全在浏览器本地运行,不依赖网络。