Html 我曾试着做chrome扩展，但遇到了麻烦

所以我试着在csgosquad.com/ranks中使用litle chrome扩展来改变颜色

使用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;
}`

但我还是需要手动更换

---

那么如何让它自动改变呢？嗯。。。看起来代码几乎没问题，但我发现了一个问题

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

---

放在“css”行末尾的逗号：[“sheet.css”]，。此manifest.json文件可能无效。您应该确认您的扩展是否已在上成功注册chrome://extensions 第页。

有三点

删除内容_脚本中的最后一个“，”

删除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;
}`

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

---

非常感谢！！！！