CSS Debugger EN
Alaa Eldeep · EEdge MV3
Toggle CSS outlines and other debugging overlays.
简介
CSS Debugger helps you quickly visualize and debug page layouts. Easily toggle outlines around specific elements or the entire page using a customizable color, thickness, and style. You can also overlay a grid to align elements, display tooltips showing element dimensions on hover, and enable Shift+Click to inspect any element’s tag, ID, classes, and box metrics in real-time.
Features:
- Customizable Outlines: Choose outline color, thickness, style, and the CSS selector you want to highlight.
- Grid Overlay: Turn on a grid to check alignment across your page.
- Dimension Tooltips: See element width and height on hover.
- Click-to-Inspect: Press Shift and click on any element to get details about its tag, classes, ID, margins, and size.
Perfect for frontend developers and designers who need a simple yet powerful CSS debugging tool. Just press Ctrl+Shift+O (or use the popup) to toggle the debugger on any site!
CSS Debugger 是做什么的
CSS Debugger 是一款面向 Edge 的实用工具类扩展，主要用来解决浏览器里某类具体的小问题。官方对它的介绍是：Toggle CSS outlines and other debugging overlays.在微软 Edge 加载项商店上，它当前版本 1.0，评分 5（1 人评价），约 169 名用户。
适合什么人用
从功能定位看，CSS Debugger 更适合想补上浏览器原生缺失功能的用户。如果你平时只是偶尔遇到相关需求，用浏览器自带功能也能凑合；但如果这件事每天都发生，装一个专门处理它的扩展通常比手动操作省事得多。
怎么安装 CSS Debugger
- 打开微软 Edge 加载项商店上的官方页面；
- 点「添加到浏览器」并确认权限提示；
- 装好后在扩展列表里固定图标，方便随时开关。
本站只做索引与介绍，安装包来自官方商店。如果商店页面提示当前地区不可用，说明该扩展未在你所在区域上架。
常见问题
CSS Debugger 是免费的吗？
CSS Debugger 在微软 Edge 加载项商店免费提供下载。它是浏览器扩展，装上就能直接用，不需要注册账号。
CSS Debugger 安全吗？
它只申请了 0 项权限，范围比较克制，没有申请「读取所有网站数据」这种大权限。
CSS Debugger 支持哪些浏览器？
当前收录的版本来自微软 Edge 加载项商店，适用于 Edge。同一个扩展在其他商店可能有对应版本，但功能与版本号不一定相同。
怎么卸载 CSS Debugger？
在扩展管理页找到 CSS Debugger，点移除即可。它在本地保存的设置会一起清掉，不会残留数据。
权限清单 来自 manifest.json 原文
接口权限 3
activeTabscriptingstorage