前端开发 & 网页设计工具

网页对齐,
交给一根线

在任意网页上拖出一条横线或竖线,精准对齐元素、检查间距,颜色粗细随意调整,刷新页面后自动恢复位置。

Chrome 扩展 当前版本 v1.0.0 免费使用
下载插件 查看安装方法
ZIP 安装包约 13 KB · 下载后解压安装
一根线插件产品封面
Chrome 可用
横竖参考线
本地运行
位置自动保存
核心功能

少一点反复目测,多一点精准对齐

围绕网页布局检查与设计走查设计,操作简单,随用随删。

横竖双向参考线

一键添加水平线或垂直线,直接在网页上拖拽到目标位置,操作直观流畅。

颜色与粗细自定义

内置多种预设颜色,支持自定义取色,线条粗细可独立调节,满足不同场景需求。

位置自动保存

刷新页面后参考线自动恢复原位,无需重复设置,告别重复操作。

多线条独立管理

支持同时添加多条参考线,每条线颜色与粗细独立控制,一键清除全部。

轻量无打扰

插件体积极小,不收集数据,不注入广告,只在你需要时工作,其余时间无感知。

完全本地运行

所有数据仅存储在本地浏览器中,无任何网络请求,完全离线可用。

使用流程

从安装到用上,不超过一分钟

安装完成后,点击工具栏图标即可操作参考线。

下载解压

下载 ZIP 包,解压到一个不会随意删除的文件夹。

加载插件

打开 chrome://extensions,开启开发者模式后选择解压文件夹加载。

添加参考线

打开任意网页,点击工具栏"一根线"图标,选择新建横线或竖线。

拖拽调整

在网页上直接拖动参考线到目标位置,调整颜色与粗细,用完即清。

五步完成安装

这是浏览器本地扩展,需要在扩展管理页中手动加载一次。

1
下载并解压点击下载按钮,将 ZIP 安装包解压到一个固定位置(如桌面的专属文件夹),不要随意移动或删除该文件夹。
2
打开扩展管理页在 Chrome 地址栏输入 chrome://extensions 并回车。
3
开启开发者模式点击页面右上角的"开发者模式"开关,将其打开(按钮会变为蓝色)。
4
加载插件文件夹点击"加载已解压的扩展程序",选择刚才解压的 一根线 文件夹并确认。
5
固定到工具栏(推荐)点击 Chrome 右上角拼图图标 🧩,找到"一根线",点击图钉将其固定,方便随时调用。
注意:chrome:// 等浏览器内置页面不支持注入脚本,请切换到普通网页后再使用参考线功能。
常见问题

下载前,你可能想知道

插件支持哪些浏览器?

当前针对 Chrome 浏览器测试。基于 Chromium 内核的 Edge、Brave 等浏览器也可以通过相同方式加载,但未经过完整测试。

为什么不能像普通软件一样直接安装?

Chrome 商店之外的扩展需要通过"开发者模式"手动加载文件夹。操作只需一次,加载后插件会一直保留在浏览器中,除非你手动移除。

参考线会影响页面上的其他操作吗?

参考线以覆盖层方式显示在页面最顶层,不影响页面内容的正常点击和交互。不需要时可以在弹窗中一键清除全部线条。

插件会收集我的浏览记录吗?

不会。插件完全在本地运行,所有数据(线条位置、颜色、粗细)仅存储在浏览器本地存储中,没有任何数据会被上传到服务器。

换了电脑,参考线还在吗?

参考线数据保存在本地浏览器存储中,换电脑或重装浏览器后不会同步。插件本身需要在新设备上重新加载,参考线配置需重新设置。

准备好精准对齐了吗?

下载一根线,解压并加载到 Chrome,在任意网页上随时拖出参考线。

免费下载 v1.0.0