CRX id
hhcokjpdklpgebgklpelpkekgiojnjca
hhcokjpdklpgebgklpelpkekgiojnjca
Description from extension meta
Ctrl+드래그(Mac: Cmd+드래그)로 웹 요소의 CSS position 값을 실시간으로 표시하는 개발자 도구입니다.
Description from store
🎯 为Web开发者打造的革命性CSS定位工具
Elements Position Drag Overlay是一款革命性的Chrome扩展程序，完全改变了CSS定位工作方式。在拖拽元素时获得实时坐标反馈，让CSS定位变得更快、更准确、更直观。
✨ 为什么这款扩展如此革命性？
即时视觉反馈：拖拽position: absolute元素时实时查看left、top、right、bottom CSS值。不再需要猜测或试错，无需在浏览器和代码编辑器之间来回切换！
开发者优先设计：专为需要精确元素定位的前端开发者、UI设计师和QA工程师精心打造。
🚀 核心功能
🎮 直观的拖拽控制
• Windows：Ctrl + 拖拽移动绝对定位元素
• Mac：Cmd + 拖拽提供macOS无缝体验
• 智能检测：仅position: absolute元素可拖拽 - 防止意外更改布局
• 悬停高亮显示可拖拽元素
📊 实时位置显示
• 显示精确CSS坐标的实时覆盖层
• 四值显示：以像素为单位显示left、top、right、bottom
• 拖拽时即时更新 - 实时查看变化！
• 可自定义覆盖层位置（4个角落选项）
⚙️ 完全可定制界面
• 覆盖层位置：从左上、右上、左下、右下中选择
• 吐司通知：启用/禁用拖拽开始/结束消息
• 悬停高亮：使用可定制颜色进行视觉元素选择
• 持久覆盖层：拖拽完成后保持位置显示
• 现代玻璃形态弹窗设计
🔧 专业开发者工具
• 键盘快捷键：Ctrl+Shift+Q（Windows）/ Cmd+Shift+Q（Mac）切换扩展
• 智能元素检测：自动识别可拖拽元素
• 跨平台支持：Windows和Mac完美兼容
• 无布局干扰：仅影响position: absolute元素
• Chrome浏览器间设置同步
💡 完美适用于
前端开发者：像素级精确元素定位。完美适用于响应式设计、模态框定位、下拉菜单、工具提示和复杂布局。
UI/UX设计师：快速原型化布局并调整元素放置。无需触及代码即可测试不同定位场景。
QA工程师：验证不同屏幕尺寸和设备上的定位准确性。确保元素在各种视口尺寸中正确定位。
CSS学习者：可视化学习CSS定位概念。立即查看定位更改的结果。
网页代理：通过更快、更准确的元素定位加速客户工作。显著减少开发时间。
🎯 使用方法
1. 从Chrome网上应用店安装扩展程序
2. 访问您想要处理的网站
3. 按住Ctrl（Mac上按Cmd）并拖拽绝对定位元素
4. 移动元素时观察实时更新的位置值
5. 释放鼠标完成定位
6. 通过扩展弹窗访问设置进行自定义
🔥 专业技巧
• 使用Esc键立即隐藏覆盖层
• 在包括localhost在内的所有网站上运行
• 完美适用于响应式设计测试
• 理想用于模态框、弹窗、覆盖层定位
• 优秀的动画起始/结束位置微调
🛡️ 隐私和安全
• 无数据收集 - 您的隐私100%受保护
• 完全在浏览器本地运行
• 无外部服务器或跟踪
• 开源开发方法
• 只需最小权限
💻 技术规格
• 支持所有现代网站
• 兼容动态内容和SPA
• 兼容所有CSS框架（Bootstrap、Tailwind等）
• 轻量快速 - 无性能影响
• 跨平台键盘快捷键
• 现代Chrome扩展Manifest V3
🌟 为什么选择Elements Position Drag Overlay？
这不仅仅是另一个开发者工具 - 这是CSS定位方法的范式转变。取代传统的猜测-检查方法，提供即时、可视化的反馈，让定位变得直观而精确。
之前：编写CSS → 刷新 → 检查 → 调整 → 重复
现在：拖拽 → 查看坐标 → 几秒钟内完美定位！
今天就改变您的开发工作流程。加入已经革新其CSS定位过程的数千名开发者。
立即下载体验CSS开发的未来！