Better Ruler
30,000+ users
Developer: paul
Version: 1.3.31
Updated: 2026-05-31
Available in the
Chrome Web Store
Chrome Web Store
Install & Try Now!
z`(可自定义):全局快捷键启动/关闭插件 - **快捷控制**: **独立颜色和透明度**:每个测量框可单独设置颜色和透明度,选中元素时修改只影响当前选中项 ## 变为临时关闭吸附) - 设置为 文件。 `cmd+shift+z`:重做 x、y (mac - 中开启"允许访问文件网址",即可测量本地 - `device - `alt` - - [插件地址](https://chrome.google.com/webstore/detail/better-ruler/ilcnadaaninblgbekoaihdhoiecaflie) touch`)。 **一款支持智能吸附的网页测量工具,让前端开发和 - 功能特性 ### **虚线背景**:可选择测量框使用实心或虚线背景效果 `shift` 键(可配置):切换工具栏显示/隐藏 `r` **全局模式**:开启后,修改颜色或透明度会同时影响所有已存在的测量框 - type` - `alt - alt `cmd+z`:撤销(支持绘制、删除、移动、缩放操作) - 双击 `option`),可自动识别并吸附到页面元素,支持吸附到**边线、四个顶点和四条边线中点**,实时显示元素尺寸。吸附预览框颜色会自动与测量框区分,便于识别。 **参考线**:自动显示水平和垂直参考线,并标注 **shadow - - `f` **兼容性**:支持移动端模拟模式(需将 **esc**:退出编辑模式 **单一模式**:开启后只能同时存在一个测量框,绘制新框时自动清除旧框 **自由编辑**:双击已创建的测量区域进入编辑模式,可自由拖拽位置或调整大小。 `ctrl+z` **十字线**:可配置是否鼠标十字参考线 **个性化定制**: - 设计更轻松。** `ctrl+shift+z` / - - **本地支持**:在 按钮悬停可查看所有快捷键说明。 - 键:切换尺寸数值显示/隐藏 键(可配置):切换参考线显示/隐藏 **尺寸位置**:可配置尺寸信息显示位置(中心、四个角等) / - **快捷键帮助**:工具栏中的 键(可配置):页面内快速激活/关闭插件(需插件至少启动过一次) + ✨ `?` - ruler - x **即时测量**:按住左键拖动,即可在吸附元素边缘的同时创建测量区域。 better **工具栏提示**:隐藏工具栏后会显示恢复提示,避免忘记快捷键。 - html `no `chrome://extensions` 为 ui **智能吸附**:移动鼠标时按住 - 即可持续吸附,alt **backspace**:删除当前选中的测k区域 **状态指示**:插件图标会根据启用状态变化(彩色=启用,灰色=关闭),方便识别当前状态。 - - 180`)到剪贴板。 - `z` 颜色配置**:吸附预览框颜色可独立配置,不再仅依赖测量框颜色推算。 键(可配置):切换吸附模式(开启后无需按住 - **一键复制**:点击测量框上的尺寸标签即可复制尺寸值(如 - `s` - 坐标 `320
Related
Designer Tools
80,000+
PixGrid Ruler
30,000+
Page Ruler
500,000+
Grid Lines Ruler
7,000+
Grid Ruler
100,000+
Measuremate — Pixel Ruler for Web Design
30,000+
Dimensions
100,000+
Liner. The Real Ruler
10,000+
Screen Ruler - Measure and Inspect the Web
50,000+
Page Ruler
10,000+
Ruler Measurement
20,000+
Simple Ruler Beta
5,000+



