я попытался сделать расширение хрома, но у меня есть проблемы

Question

Так я попытался сделать LITLE расширения хрома просто изменить цвет в 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 
} 

и листа .css

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

, но я все еще нужно, чтобы изменить это вручную like this

Итак, что делать, чтобы получить автоматическое изменение?

Answer 1

Есть три очка,

1. Удалите последний "" в пределах content_scripts
2. Remove "`" в пределах sheet.css
3. Добавить "важно!", Чтобы убедиться, что ваш 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; 
} 

Answer 2

Хм ... похоже, что код почти нормально, но я нашел одну проблему.

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

Запятая положить на конце линии "CSS": [ "sheet.css"],. Возможно, этот файл manifest.json недействителен. Вы должны подтвердить, было ли ваше расширение успешно зарегистрировано на странице chrome: // extensions.