Inspect
Inspect elements with css variables
什么是Inspect？
Inspect是由peppertom开发的Chrome扩展程序，该扩展的主要功能是“Inspect elements with css variables”。
扩展截图
下载Inspect扩展crx文件
下载Inspect扩展crx格式的文件，手动将Chrome插件安装到浏览器中，也可以将crx文件分享给朋友，轻松安装Chrome插件。
扩展使用说明
Inspect extension for getting potencial css variables and easily copy them to clipboard. 🎨🧐🔎
This extension mimics and enhances the built-in devtools inspector by adding the explored css variables to the inspector box too. It allowes developers to easily extract any css variables used for styling the inspected element.
How to use it?
1. Activate the extension by clicking on it.
2. Inspect the document as if you were inspecting it with devtools' inspector.
3. Toggle 'inspect mode' and 'paused' mode by pressing 'alt + s' on your keyboard. ⌨️
4 . Copy the desired property's value by clicking on it 🖱️.
5. Remove inspector extension by clicking on it if you are done. 扩展基本信息
| 名称 |  Inspect |
| ID | mfgcajjmbmalmniplbocamfkppkcnhdh |
| 官方URL | https://chromewebstore.google.com/detail/inspect/mfgcajjmbmalmniplbocamfkppkcnhdh |
| 简介 | Inspect elements with css variables |
| 文件大小 | 14.77 KB |
| 安装次数 | 52 |
| 当前版本 | 1.0 |
| 更新时间 | 2022-03-02 |
| 上架时间 | 2022-03-01 |
| 开发者 | peppertom |
| 电子邮箱 | [email protected] |
| 付费类型 | free |
| 支持的语言 | en-US |
| manifest.json | |
{
"update_url": "https:\/\/clients2.google.com\/service\/update2\/crx",
"name": "Inspect",
"description": "Inspect elements with css variables",
"version": "1.0",
"manifest_version": 3,
"background": {
"service_worker": "background.js"
},
"permissions": [
"activeTab",
"scripting"
],
"host_permissions": [
"http:\/\/*\/*",
"https:\/\/*\/*",
"file:\/\/\/*\/*"
],
"web_accessible_resources": [
{
"resources": [
"inspect\/*"
],
"matches": [
"*:\/\/*\/*"
]
}
],
"action": {
"default_title": "Click to activate",
"default_icon": {
"16": "\/images\/inspect-icon-16.png",
"24": "\/images\/inspect-icon-24.png",
"32": "\/images\/inspect-icon-32.png",
"48": "\/images\/inspect-icon-48.png",
"96": "\/images\/inspect-icon-96.png",
"128": "\/images\/inspect-icon-128.png"
}
},
"icons": {
"16": "\/images\/inspect-icon-16.png",
"24": "\/images\/inspect-icon-24.png",
"32": "\/images\/inspect-icon-32.png",
"48": "\/images\/inspect-icon-48.png",
"96": "\/images\/inspect-icon-96.png",
"128": "\/images\/inspect-icon-128.png"
}
} | |
