Chrome 拡張機能で CSS を使用してローカル画像を読み込めないのはなぜですか?

Google Chrome 拡張機能で CSS を使用してローカル画像を読み込むことができません

質問:

A開発者は、Chrome 拡張機能内でローカル画像がパックされているにもかかわらず、CSS を使用してロードできないという問題に直面しています。

回答:

Chrome 拡張機能では、画像chrome-extension:// プロトコルを使用してロードでき、その後に拡張機能の ID と画像へのパスが続きます。画像は、拡張機能のマニフェスト ファイルの web_accessible_resources セクションにもリストされている必要があります。

ローカル画像を正しくロードする CSS ルールの例を次に示します。

body {
    background-image: url('chrome-extension://__MSG_@@extension_id__/images/main.png') !important;
    background-repeat: repeat !important;
}

これは、画像が配置されていることを前提としています。

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

このアプローチに従うことで、CSS を使用してローカル画像を Google Chrome 拡張機能に正常に読み込むことができます。

以上がChrome 拡張機能で CSS を使用してローカル画像を読み込めないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。