屏幕标尺 - 测量屏幕像素
拖动以像素为单位测量区域,实时跟踪鼠标坐标,并查看屏幕分辨率信息。
화면 정보
-
화면 너비
-
화면 높이
-
디바이스 픽셀 비율
-
뷰포트 너비
-
뷰포트 높이
측정 영역
px
클릭하고 드래그하여 영역을 측정하세요.
마우스 위치가 실시간으로 표시됩니다.
마우스 위치가 실시간으로 표시됩니다.
현재 측정값
— px
너비
— px
높이
—
Mouse X
—
Mouse Y
측정 기록
아직 측정 결과가 없습니다. 위의 캔버스에서 드래그하세요.
什么是屏幕标尺?
屏幕标尺允许您通过拖动选择区域来测量屏幕上的像素距离。它显示带有刻度的水平和垂直标尺,实时显示您的鼠标位置,并报告您选择的任何区域的宽度和高度。 对于网页设计师、UI 开发人员以及任何需要精确像素测量而无需安装软件的人员非常有用。
如何在屏幕上测量像素
- 选择模式 — 选择矩形(区域)或直线(距离)模式
- 点击并拖动 — 点击测量画布并拖动以绘制您的选择
- 读取结果 — 宽度、高度和鼠标位置在您拖动时实时更新
- 查看历史记录 — 每个完成的测量结果都保存在下面的历史记录列表中
- 检查屏幕信息 — 您的屏幕分辨率、视口大小和设备像素比显示在顶部
为什么要使用此屏幕标尺?
- 无需安装 — 直接在您的浏览器中工作,无需扩展或下载
- 矩形和直线模式 — 测量区域或直线距离
- 像素完美标尺 — 带有 10 像素/50 像素/100 像素刻度的水平和垂直标尺
- 实时跟踪 — 鼠标坐标在您移动时立即更新
- 屏幕信息 — 立即查看您的屏幕分辨率、视口尺寸和 DPR
- 测量历史记录 — 所有测量结果都会被保存以供参考,直到您清除它们
- 隐私 — 一切都在您的浏览器中运行,不会向任何地方发送任何数据
FreeToolbox 与其他屏幕标尺的比较
| 功能 | FreeToolbox | PicPick | MeasureIt 扩展 |
|---|---|---|---|
| 安装 | 无(浏览器) | 桌面应用 | 浏览器扩展 |
| 矩形 + 直线 | 是 | 是 | 仅矩形 |
| 带有刻度的标尺 | 是 | 是 | 否 |
| 屏幕分辨率信息 | 是 | 否 | 否 |
| 测量历史记录 | 是 | 否 | 否 |
| 深色模式 | 是 | 系统 | 否 |
| 价格 | 免费 | 免费/付费 | 免费 |
常见问题
它是否测量我的实际屏幕?
它测量工具画布区域内的像素距离。 标尺和坐标以 CSS 像素为单位。 对于真实的屏幕测量,请乘以您的设备像素比(显示在“屏幕信息”部分中)。
我可以测量网页上的元素吗?
此工具在其自己的画布中进行测量。 要测量网页元素,您可以使用浏览器 DevTools (F12) 或截取屏幕截图并使用此工具进行测量。
什么是设备像素比?
设备像素比 (DPR) 是屏幕上物理像素与 CSS 像素的比率。 2 的 DPR 意味着每个 CSS 像素都使用 2×2 物理像素渲染,这在 Retina/HiDPI 显示器上很常见。
测量数据是否已保存?
测量结果仅在您的会话期间保存在内存中。 它们不会保存到 localStorage 或发送到任何服务器。 刷新页面会清除所有测量结果。
我可以在矩形和直线模式之间切换吗?
是的。 单击画布上方的“矩形”或“直线”按钮可以随时切换模式。 两种类型的先前测量结果仍然在画布上可见。