我曾尝试制作 chrome 扩展，但我遇到了麻烦 [关闭]答案

【问题标题】：I had tried to make chrome extension but i have troubles [closed]我曾尝试制作 chrome 扩展，但我遇到了麻烦 [关闭]
【发布时间】：2016-01-22 22:00:34
【问题描述】：

所以我尝试制作小 chrome 扩展只是为了改变 csgosquad.com/ranks color of thoose orange bars to red 中的颜色

使用 manifest.json

{
  "name": "Top Questions redder",
  "description": "Make the world red",
  "version": "1.0",
  "content_scripts": [
    {
    "matches": ["https://csgosquad.com/ranks"],
    "css": ["sheet.css"],
    }
  ],
  "manifest_version": 2
}

和 sheet.css

`.row-rank .progress.bar-rank .progress-bar
{
    background-color: #ff0b00;
}`

但我仍然需要手动更改它like this

那么如何让它自动改变呢？

【问题讨论】：

标签： html css json google-chrome-extension google-chrome-app

【解决方案1】：

有三个点，

删除 content_scripts 中的最后一个“，”
删除 sheet.css 中的“`”
添加“!important”以确保您的 css 具有更高的特异性

manifest.json：

{
    "name": "Top Questions redder",
    "description": "Make the world red",
    "version": "1.0",
    "content_scripts": [
        {
            "matches": [
                "https://csgosquad.com/ranks"
            ],
            "css": [
                "sheet.css"
            ]
        }
    ],
    "manifest_version": 2
}

sheet.css

.row-rank .progress.bar-rank .progress-bar
{
    background-color: #ff0b00 !important;
}

【讨论】：

非常感谢！！！！

【解决方案2】：

嗯……好像代码差不多OK了，不过我发现了一个问题。

"content_scripts": [
  {
    "matches": ["https://csgosquad.com/ranks"],
    "css": ["sheet.css"],
  }
],

逗号放在行尾"css": ["sheet.css"],。可能，这个 manifest.json 文件是无效的。您应该在 chrome://extensions 页面上确认您的扩展程序是否已成功注册。

【讨论】：