FirefoxでWebページの配色を反転する方法は?


10

私は暗い部屋でWebを閲覧するために使用し、背景が暗く、テキストが明るいほうが一般的である反対ではなく、むしろ好ましいと思います。これはカスタムCSSまたはJSコードを適用することで達成できると思いますが、Webコーダーではなく、これを行う方法がわかりません(特にすべてのWebサイトに適用できるため)。インストールして必要な効果だけを取得する拡張機能があると、さらに素晴らしいでしょう。

助言がありますか?


あなたは見ていたいかもしれません赤方偏移を
クリスティアンCiupitu 2013年

回答:


16

WebKitベースのブラウザーでは、次のスタイルを追加して色反転を実現できます。

html { -webkit-filter: invert(); }

ここに画像の説明を入力してください

悲しいことに、私たちは現在Firefoxでの実装を待っています:https : //developer.mozilla.org/en-US/docs/CSS/filter#Browser_compatibility

Firefoxでこれに相当するものは次のようになります。

html {
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'invert\'><feColorMatrix type=\'matrix\' values=\'-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0\'/></filter></svg>#invert");
}

ただし、結果はそれほど良くはありません。

ここに画像の説明を入力してください

ボーナス

これがWebKitのブックマークレットです(jQueryをロードする必要があります):

javascript:$("html").css("-webkit-filter","invert()")

私の場合、ウェブサイトの境界線は反転していません。リンク。だけでなく、別のタグも反転する必要があると思いhtmlます。境界線を反転させるにはどうすればよいですか?
Utku、2016年

2

これを試してください.. [ツール]> [オプション]> [コンテンツ]タブをクリックし、[色]ボタンをクリックします。ここで、[ページを許可]のチェックを外します。次に、テキストに白色、暗に黒色を選択します。それが役に立てば幸い。ver24.0でやった。


1

(編集:MozillaがInvertをサポートしないことにしたため、ブックマークレットがFirefoxで機能しないことに気づきました。ただし、同じことを行うjQueryリンクがページにあります。)このページでブックマークレットを使用できます: http:/ /lea.verou.me/2011/04/invert-a-whole-webpage-with-css-only/

オペレーティング・システム?私のMacにはNocturneというアプリがあります。アプリ全体で色が反転します。ctrl-option-cmd-F8を押すのと同じです。Windowsでそれを行う方法がわかりません。Nocturneは、色を微調整したり反転させたりするだけではなく、夜間や薄暗い照明下での表示を少し良くするので、少し快適です。ここでの利点は、Firefoxページだけでなく、すべてが切り替えられることであり、新しいページをロードするたびに再適用する必要がないということです。



0

次のURLでブックマークレットを作成します。

javascript:void(document.getElementsByTagName('html')[0].style.webkitFilter='invert()');
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.