18

現在の Web ページにスクリプト タグを挿入するブックマークレットを使用しています。

このスクリプトには、いくつかの UI と " input type=submit...." タグが含まれています。

Web ページ A は " input type=submit.." タグのスタイルを設定しないことを選択しましたが、Web ページ B はタグのスタイルを設定しています。

これにより、下にあるページのスタイルに基づいて、異なるスタイルの送信ボタンがブックマークレットに表示されます。

送信ボタンをすべての Web ページでデフォルトの方法で同じスタイルにしたい。

1 つの解決策は、スクリプト内の送信ボタンの CSS スタイルを設定して、すべてのページで同じように表示されるようにすることです。(これは私が他のすべてのタグに対して行ったことです)。

私の質問は：

  1. 「デフォルトの方法」で表示されるように送信ボタンの CSS スタイルを設定するにはどうすればよいですか?
  2. 既存のスタイルを削除できますか?もしそうなら、ボタンを「デフォルトの方法」で表示するにはどうすればよいですか?

つまり、基になる Web ページがスタイルを選択したかどうかに関係なく、ブックマークレットの UI 内の送信ボタンを「デフォルトの方法」で表示するにはどうすればよいですか?

注：「デフォルトの方法」とは、スタイリングが追加されていない場合の送信ボタンの表示方法を意味します。たとえば、http://www.google.comの「Google 検索」ボタンや「幸運を感じています」ボタンなどです。

perl ソリューションには、すべての文字列を 1 回の操作で "トランザクション的に" 置き換えるという利点があります。Java に同じオプションがない場合 (そして、それを実現する方法が思いつかない場合)、R1=>R2、次に R2=>R3 を置き換えることに注意する必要があります。その場合、R1 と R2 の両方が最終的に R3 に置き換えられます。

4

10 に答える 10

8

Mozilla Developer Centerから取得

デフォルトのプロパティ値を復元する CSS は「デフォルト」キーワードを提供しないため、プロパティのデフォルト値を復元する唯一の方法は、そのプロパティを明示的に再宣言することです。したがって、より具体的なルール (id セレクターまたはクラス セレクターを使用するものなど) でオーバーライドしたいセレクター (たとえば、p などのタグ名によるセレクター) を使用してスタイル ルールを記述する場合は、特に注意する必要があります。値を自動的に復元することはできません。CSS のカスケードの性質のため、スタイル ルールをできるだけ具体的に定義して、意図しないスタイル要素のスタイル設定を防止することをお勧めします。

あなたが持っている唯一の方法は、CSS ルールで非常に明示的なボタンに独自のクラスを設定することです。

background-color:grey !important;

それ以外の

background:grey;
于 2008-12-19T14:44:20.100 に答える
5

送信ボタンに影響を与えないように、INPUT (送信ボタンは入力タイプ) の CSS スタイルを制限できます。

したがって、単に置く代わりに：

input{
blah; blah; blah;
}

スタイルを作成できます:

input[type="text"] {
blah blah blah
}

そして、それはテキスト入力にのみ影響し、送信ボタンを含む他のすべてをデフォルトのままにします.

resource://gre/res/forms.css への JWW の参照は役に立ちます。それを見れば、いくつかの異なるタイプの入力に影響を与えるスタイルを設定する方法がわかります。

于 2009-07-16T21:46:37.170 に答える
1

ありがとう、良い結果で使用

INPUT, SELECT
{
    color: #003333;
    font-size: 90%;
    border-bottom: #d3d3d3 1px solid;
    border-left: #d3d3d3 1px solid;
    border-top: #d3d3d3 1px solid;
    border-right: #d3d3d3 1px solid;
}

INPUT[type="submit"]
{
    background-color: #336699;
    color: #f0e68c;
}
于 2010-04-04T18:04:13.290 に答える
1

上記の Firefox のデフォルト スタイルの URL は、少なくとも ff14 では機能しなくなりました。新しい場所は次のとおりです。

resource:///chrome/toolkit/res/forms.css
于 2012-07-25T11:07:47.197 に答える
0

私がやったことは、すべてのブラウザで動作するようです...

$(buttonID).css({
'background-color':''
});

background-color を空のままにしておくだけで、ボタンがデフォルトの状態に戻るようです。

于 2012-11-06T10:07:55.393 に答える
0

私は同じ問題を思いついた。この投稿は私を大いに助けました。その CSS ルールを特別なテーブルのテキスト入力に割り当てる必要がありましたが、ページ内のすべてのテキスト入力に割り当てる必要はありませんでした。そのため、テーブルの ID で CSS ルールを使用する必要がありました。これは、フォーム ID でうまく機能するはずです。

「#addForum note」は、特殊なフォーマットのテーブルの ID です。


#addForumNote input[type="text"], label, textarea{
  width: 425px;
  background-color: #ccc;
  border-style: solid;
  border: 1px;
  border-color: #7a7b7a;
}

これが誰かを助けることを願っています。ありがとう。

于 2010-12-31T03:42:34.090 に答える
0

計算されたスタイルにアクセスする方法はないと思います。Javascript (私の知る限り) は、インライン スタイルを設定し、クラスを割り当てることしかできません。DOM スタイル オブジェクトが計算されたスタイルにアクセスできることを望みますが、残念ながらそうではありません。

この時点で考えられる最善の方法は、独自の css ルールを宣言して、ホスト サイトが使用するものをオーバーライドすることです。css ルールがより具体的である限り、最終的には成功します。これにより、ブラウザ間でブックマークレットのルック アンド フィールが一貫したものになります。

于 2011-04-15T20:27:05.447 に答える