2017-03-25 3 views
1

EDIT:フォーカスリングはGrab And Drag pluginによって引き起こされます。修正については下の私の答えを参照してください。Firefoxからフォーカスリングを削除するには、メインウィンドウの正しい選択子は何ですか?

ウェブページのボディのいずれかの部分をクリックするたびに、Firefox (Pale Moon 27.2.1)はブラウザウィンドウの周辺にフォーカスリングを置きます(スクリーンショットを参照)。これはすべてのWebページでこれを行います。

この質問には何百万回もの質問がありましたが、これまでの解決策はもう役に立たないようです。 hereおよびhereを参照してください。

私はできるあなたにやると動作しないいくつかのことを教えてくれ:

「ワイルドカード」セレクタは、次の宣言とフォーカスリングを削除しますが、明らかにすべてのウェブサイトを壊す:

* { 
    /* WORKS */ 
    color: transparent !important; 
    text-shadow: 0 0 0 #000 !important; 

    /* ALSO WORKS */ 
    border: 1px solid white !important; 
    outline: 2px solid white !important; 
    outline-offset: -1px !important; 
} 

これらのセレクタは動作しません:

:focus 
::-moz-focus-inner 
:-moz-focusring 
:active 
:focus 
::-moz-focus-outer 

は、これらの宣言は動作しません。

border: 0 !important; 
border: none !important; 
outline: 0 !important; 
outline: none !important; 
-moz-outline-style: /* NOPE */; 

スクリーンショット:

Reddit/Google in Firefox showing inner focus rings

私は、上記のルール(@-moz-document url-prefix("http://"), url-prefix("https://"))を持つすべてのWebページのスタイルをスタイリッシュを使用しています。また、私はこのようになりますし、他のすべてのために正常に動作し、別のスタイリッシュなルールセットを使用しています:

:active, :focus, ::-moz-focus-inner { 
    outline: 0 !important; 
} 

a:link, a:visited, a:hover, a:active { 
    outline: 0 !important; 
} 

radio * { 
    border-width: 0 1px 0 0 !important; 
    border-style: dotted !important; 
    border-color: transparent !important; 
} 
+0

これはFirefoxにタグ付けされていますが、FFで問題は表示されません(Palemoon ATTはインストールされません)。 ..あなたの最初のコードグループで、 '*'を 'html'や' body'で置き換えてみてください。 –

+0

あなたの助けを借りて、私は以下の質問に答えました。自分の答えに自分の答えのコードをコピーして貼り付けるには、あなたのものを正しいものとしてマークします。 – Jeff

+0

ありがとうございます。しかし、あなたは答えを得ており、私は担当者*があまり必要ありません。 ;) –

答えて

0

これはトリックをし、私はまだFirefoxが何であるかを思ったんだけどものの「色?」

EDIT:フォーカスリングは、Grab And Drag addon> = v.3.2。*によって引き起こされます。私にとっては、Grab And Drag v.1.1.9.1を使用することでした。これは、クリックしてドラッグすると、Webページの本文にフォーカスリングが表示されません。

@-moz-document regexp("https?://.*") { 
    html { 
     /** 
     * Remove focus rings that appear on the perimeter of the web page 
     * body when placing cursor in any form field input, then clicking 
     * anywhere in the body. 
     * 
     * This css rule breaks a lot of websites! 
     * 
     * - Works on html tag, but not body tag. 
     * - Does not work with "outline: 0 !important;" or 
     * "border: 0 !important;" 
     * - This declaration is not necessary: 
     * "text-shadow: 0 0 0 #000 !important;" 
     */ 

     color: transparent !important; 
    } 
} 
関連する問題