Css background file inside of Chrome Ex. spilling over and affecting css on normal webpages_问答_开发者

Css background file inside of Chrome Ex. spilling over and affecting css on normal webpages

开发者 https://www.devze.com 2023-03-25 20:05 出处：网络

I am working on a chrome extension and I recently moved all of the css from inside of the popup.html file to a new .css file to try and clean up the code some.

Well when we were testing we started seeing some funny behavior on some web pages that we visited a lot and it took a bit to connect it with the extension. Once we did I did some digging and realized that there were css tags inside of my css that were the same as the ones on the pages being affected and that my css was overriding the css on the page.

I have looked around on google and on stack and it seems as though I am the only one with this problem. Anyone got any ideas wh开发者_运维知识库y this would be happening.

---Edit---

Sorry I should of been more specific, I did use programmatic injection as described on the chrome documentation site here is my manifest and part of the head of my popup.html file:

Manifest.json file

     {
       "background_page": "background.html",
       "browser_action": {
       "default_icon": "loggedout.png",
       "popup": "popup.html"
     },
       "content_scripts": [ {
       "js": [ "content/overlay.js",
       "content/jquery.js","content/jquery.watermark.min.js"],
       "css": ["popup.css"],
       "matches": [ "http://*/*", "https://*/*" ],
       "run_at": "document_start"
      } ],

Popup.html file

      <html>
         <head>
            <link rel="stylesheet" href="popup.css" type="text/css">
            ....... other includes
         </head>

Just remove "css": ["popup.css"], line from your manifest, it is not needed. You can include any local css into your popup without describing it in the manifest (css in manifest is for content scripts only).

Unless you want your css injected into every page your extension targets, you have to use programmatic injection as described here:

http://code.google.com/chrome/extensions/content_scripts.html