Question

我正在使用colorbox插件在某些页面中创建模式对话框。对话框已创建，但我丢失了CSS的所有边框/背景覆盖...在Google Chrome控制台中，我收到如下错误：

https://www.website.com/br/cgi-bin/images/controls.png [404   没找到]

https://www.website.com/br/cgi-bin/images/border.png [404   没找到]

虽然文件'controls.png'和'border.png'在扩展名/ css的本地目录中...

我正在通过Google Chrome扩展程序的content_script注入CSS。清单：

  "content_scripts": [
  {
    "matches": ["<all_urls>"],
    "css": ["colorbox.css"],
    "js": ["jquery.min.js", "jquery.colorbox.js", "dominteract.js"],
    "run_at": "document_end",
    "all_frames": true
  }],

我注意到在CSS源代码中，图像以这种方式链接：

cboxOverlay {background：url（images / overlay.png）重复0 0;}

如何将此目录声明为chrome的扩展名，知道这是本地目录而不是远程目录？

Answer 1

要链接您的图片，您必须包含您的扩展程序目录，如下所示：

background:url('chrome-extension://__MSG_@@extension_id__/images/overlay.png') repeat 0 0;

您可能需要在清单中将图片添加为web_accessible_resource，如下所示：

"web_accessible_resources": [
    "images/overlay.png"
]

在内容脚本中丢失CSS

1 个答案: