Greasemonkey/Tampermonkey を使用して「banner_url」クラスの CSS スタイルをオーバーライドする方法

Greasemonkey/Tampermonkey を使用したクラス CSS の操作

「banner_url」クラスを使用してページ要素の背景画像を変更しようとしています。必要な CSS プロパティが提供されています。

Greasemonkey による CSS カスケードの使用:

GM_addStyle() を使用して CSS ルールをページに挿入します。次のスクリプトをお勧めします:

// ==UserScript==
// @name     _Override banner_url styles
// @include  http://YOUR_SERVER.COM/YOUR_PATH/*
// @grant    GM_addStyle
// @run-at   document-start
// ==/UserScript==

GM_addStyle ( `
    .banner_url {
        background: url('http://www.pxleyes.com/images/contests/kiwis/fullsize/sourceimage.jpg') no-repeat center center fixed !important;
        -webkit-background-size: cover !important;
        -moz-background-size: cover !important;
        -o-background-size: cover !important;
        background-size: cover !important;
    }
` );

注:

• ルールに優先順位を付けるには、「! important」フラグを使用します。
• ドキュメントの開始時にスクリプトを実行して、スタイル変更時の視覚的なちらつきを最小限に抑えます。

代替:

• Tampermonkey/Violentmonkey: Greasemonkey 4 よりも推奨。
• Stylus: CSS 操作に特化した拡張機能。

以上がGreasemonkey/Tampermonkey を使用して「banner_url」クラスの CSS スタイルをオーバーライドする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。