0

サイト 'reddit' に特定の機能を追加する chrome の拡張機能を作成しました。次の jQuery を使用して、サイトの各投稿に追加のボタンを追加します。

...    
$(this).append('<li><span class="grab_button">grab</span></li>');
...

クラスgrab_buttonは新しいです。reddit スタイルシートには存在しませんが、拡張スタイルシート chrome がロードするはずの CSS が適用されていません:

html body span.grab_button {
        color: #888 !important;
        font-weight: bold !important;
        padding: 0 1px !important;
}

!important適用される CSS がオーバーライドされるようにするためのルールを追加しました。私は定義を非常に具体的にしました (おそらくもっと具体的にすることもできますが、そうする必要はありません)。いったいなぜ適用されないのでしょうか。Webkit 開発者ツールを使用して追加されたボタンを調べると、オーバーライドされているものも含め、適用されるすべてのスタイルが一覧表示されますが、カスタムのスタイルは表示されません。

マニフェストの関連セクションは次のとおりです。

"content_scripts": [
        {
            "matches": ["http://www.reddit.com/*"],
            "js": ["jquery-2.0.3.min.js", "script.js"],
        "css": ["style.css"]
        }
],

"web_accessible_resources": [
        "style.css",
    "script.js",
    "jquery-2.0.3.min.js"
]

これが機能しない理由を誰か説明できますか?

4

1 に答える 1