屏幕尺子
银行卡 / 机型预设校准 PPI 后，屏幕即成毫米英寸双刻度直尺，拖动双把手测量任意长度
在线屏幕尺子：浏览器无法直接知道你的屏幕物理宽度，所以先做一次 10 秒的校准——用一张银行卡（ISO ID-1 标准 85.60×53.98mm）在屏上对齐， 或选择设备型号套用官方分辨率/像素密度换算；校准后下方就是 cm 主刻度 + mm 次刻度的直尺，拖动 A/B 两个把手即可读出 px ↔ mm ↔ inch 三种单位。 校准值保存在本地 localStorage，下次打开不用重新校准。所有计算在浏览器本地完成，不上传任何数据。
校准（先做这一步）
找一张实体银行卡（标准尺寸 85.60 × 53.98 mm，身份证 85.6×54.0mm 亦可）， 平贴在屏幕上下方框处，拖动滑杆直到边框与实体卡完全重合，再点「确认校准」。 CSS 里的 mm 单位不可靠，所以这里只认你拖出来的像素宽。
300 px
pxPerMm = 300 ÷ 85.6 = 3.5047 px/mm
PPI ≈ 3.5047 × 25.4 = 89.0
当前校准值
3.7795 px/mm （96dpi 估算，未校准）
无法校准或没有银行卡？银行卡法最可靠：任何 85.6mm 宽的磁条卡（借记卡/信用卡/公交卡/身份证）都行； 机型预设仅建议手机用户使用，桌面大屏请优先银行卡或手动输入。
刻度尺（cm 主刻度 + mm 次刻度）
未校准 · 按 96dpi 估算正在加载刻度尺…（若长时间空白请刷新页面）
换算公式
pxPerMm = 卡片像素宽 ÷ 85.6（银行卡法）
实际长度 mm = 屏幕像素 ÷ pxPerMm；1 inch = 25.4 mm
PPI = pxPerMm × 25.4；机型法：pxPerMm = PPI ÷ (25.4 × DPR)
为什么不同屏幕「网页像素」不一样？刻度尺怎么才算准？（点击展开：原理、公式、FAQ 与来源）
CSS px ≠ 物理毫米
网页布局用的长度单位是 CSS 像素（逻辑像素）：CSS 规定在标准 96dpi 参考屏上 1px = 1/96 inch ≈ 0.2646mm， 但这只是「参考换算」——手机为了在小物理屏上显示完整桌面网页，引入了设备像素比（DPR）：iPhone 15 Pro 的 CSS 视口宽 393px， 背后是 1179 物理像素（DPR=3）。所以同样是 393px 的网页宽度，在 iPhone 15 Pro 上物理约 65mm，在一台 96dpi 的老显示器上就是约 104mm。 浏览器不会把屏幕物理尺寸暴露给网页，这就是任何「网页尺子」都必须先校准的原因。
两种校准方式的口径与公式
- 银行卡法（推荐）：对齐实体卡后 pxPerMm = 卡片像素宽 ÷ 85.6；PPI = pxPerMm × 25.4。例：卡片量得 300px → 1mm=3.5047px，PPI≈89.0。误差只来自对齐精度，通常 <1%。
- 机型预设法：pxPerMm = 官方 PPI ÷ (25.4 × DPR)；屏幕有源区宽 = 物理分辨率宽 ÷ PPI × 25.4。例：iPhone 15 Pro = 460 ÷ (25.4×3) ≈ 6.037 px/mm，393 CSS px 对应约 65.1mm 显示区（机身宽 70.6mm 含边框，不能直接用）。
- 默认未校准状态按 96dpi 估算：100px 显示 26.46mm，仅作占位参考，别拿去量东西。
常见问题 (FAQ)
为什么不能用 CSS 的 mm/cm 单位直接画尺子？
CSS 中 1mm 固定等于 96/25.4 px，与屏幕真实物理尺寸无关——在手机上「1cm」可能只有真实 7mm。所以必须靠一个已知实物（银行卡）或官方参数（机型预设）反推 pxPerMm。
校准后能测多准？
银行卡法一般可到 ±1% 量级（对齐得好可更好），足够量课本、零件、照片；但它依赖屏幕像素网格与浏览器渲染，不能替代游标卡尺做工程测量。浏览器缩放（Ctrl+/-）会改变 CSS px 与物理像素的映射，缩放后需重新校准。
手机上用哪种方式最方便？
手机选「机型预设」一键校准最方便；追求精度仍建议银行卡法。校准值已存入浏览器 localStorage（仅保存在你自己的设备上），下次打开自动恢复，换设备或清浏览器数据后需要重新校准。
外接显示器 / 投屏后读数对吗？
不对。校准值跟「校准时的那块屏」绑定，换显示器、改系统缩放比例、改浏览器缩放都会让 pxPerMm 失效，请重新校准一次。
口径与来源（两源交叉核对）
- 银行卡 85.60 × 53.98mm：ISO/IEC 7810 ID-1 规范（identicon/维基条目交叉一致），身份证 85.6×54.0mm 为第二代居民身份证公开尺寸。
- 机型 CSS 视口与 DPR：viewport 尺寸库（yesviz.com、blisk.io 设备库）两源交叉；PPI 与物理分辨率取厂商官方技术规格页（Apple Tech Specs、Samsung Specs、Google Store）。
- 96dpi 参考：CSS 绝对单位换算规范（1in = 96px = 25.4mm，W3C CSS Values and Units）。
相关工具推荐
排序算法可视化
可视化展示冒泡、快速、归并等排序过程
电子木鱼
敲一下加一功德，合成木鱼音、禅语弹幕与连击彩蛋，纯本地解压小玩具
口算题卡生成器
加减乘除混合比大小填空六种题型，进退位与带余数控制，A4 双栏打印附答案页
电缆载流量速查
铜铝电线明敷穿管安全载流量速查，温度并排修正、负载反推线径与空开档位
数据采样工具
对数据集进行采样、分桶、分组操作
数据结构构建器
可视化构建和操作数据结构