Content Scripts CSS不会覆盖原始

| 我想使用自定义设置修改网站样式的问题。我尝试使用Content Scripts,但这很有效,因为它们不能覆盖原始的CSS文件。这是一个例子: foo / manifest.json
{
  \"name\": \"test\",
  \"version\": \"1.0\",
  \"content_scripts\": [
    {
      \"matches\": [\"file://*/*test.html\"],
      \"css\": [\"main.css\"]
    }
  ]
}
foo / main.css
body {
  background: #0f0;
}
test.html
<html>
  <head>
    <title>foobar</title>
  </head>

  <body style=\"background:#f00;\">

  </body>
</html>
然后,我将扩展名foo文件夹加载到我的Google chrome中,并打开了test.html,但背景色仍然是红色。我检查了元素,然后看到了: 元素样式
body {
background: #f00;
}
用户样式表
body {
    
background: #0f0;
}
如何使用带有内容脚本的自定义CSS修改现有的CSS文件? 如果无法做到这一点,当页面特别在Google chrome中加载时,如何使用我的自定义自动修改现有的CSS。     
已邀请:
内联样式规则比从样式表导入的任何规则具有更高的先例。您可以使用
!important
指令来颠覆此行为:
body {
  background: #0f0 !important;
}
    
使用javascript,向body标签或包含其他所有内容的其他标签添加ID。然后,您可以执行以下操作:
// original rule
.someclass li a{
    color: blue;
}
// your rule
#cool-extension .someclass li a{
    color: red;
}
如果您使用原始的完整选择器,并在其前面加上ID,则规则将始终优先。     

要回复问题请先登录注册