2017-07-07 12 views
10

findInPageを使用しているElectron Webviewでは、結果の色を変更するためにCSSを使用できますか?上記画像におけるCSSを使用してwebviewをページスタイルの結果スタイルに変更しますか?

enter image description here

追加の結果は黄色で強調されている間、現在の検索結果はオレンジ色で強調表示されています。

+2

(MAC /窓/ linuxの中には彼のfaqを参照してください)、あなたは可能性があり'Ctrl-F'キーイベントを無効にして、自分で作ります。 –

+0

@Matt Bierner CSSで実装することは重要ですか? Javaスクリプトで書くのはとても簡単だからです。 – aghilpro

+0

私はそれがどのように実装されているか気にしませんが、そうでなければ私に納得させることができない限り、JSのページ検索を再実装するのは、驚くほど難しい簡単な問題の1つです。 –

答えて

1

電子では、stopfindInPageを使用して検索を停止し、フォーカスを移動したり選択をアクティブにしたりできます(activateSelection - フォーカスと選択ノードをクリックしてください)。私はそれを試していない

::selection { 
    background: #ffb7b7; /* WebKit/Blink Browsers */ 
} 
::-moz-selection { 
    background: #ffb7b7; /* Gecko Browsers */ 
} 

、それはだ:それはinsert cssすることも可能であるように、これは以下のようなものを使用することにより、選択したテキストの色/ BG =色を更新するために、あなたは、CSSを挿入することを可能にしますAPIを見ることからの示唆に過ぎません。 あなたもこのことができます、そしてあなたが解決

EDIT見つけることに有用

希望を見つけることができcss tricksに興味深い記事があります:あなたがMac上である場合

はあなたがsetUserDefaultを使用することができますが、システムの設定。また

、あなたがNathan Buchar's electron settingsを使用する場合は、キーの値を調整するsetメソッドを使用することができます - まあ

+0

提案をお寄せいただきありがとうございます。残念ながら、セレクションCSSでは、ページ内の一致の検索は処理されません。あなたの返信は私にクロム源を見てもらうように促しました。私はソースが一致する色を見つけたと信じています:https://cs.chromium.org/chromium/src/third_party/WebKit/Source/core/layout/LayoutTheme。 cpp?dr = CSs&l = 816彼らはハードコードされているように見えますか? –

+0

@MattBiernerこれらのリンクを参照してください。この最初のものは、Chromeのフォーラム(https://www.squarefree.com/bookmarklets/color.html)の開発者によって提案されました。 https://www.jetbrains.com/help/clion/configuring-colors-and-fonts.htmlとhttps://developer.chrome.com/devtools/docs/elements-styles –

+0

@MattBiernerの最初のリンクも調べてくださいクロムの背景色を変更する方法のクエリへの返信で示唆しましたが、私はそれが選択されたテキストの背景だけを変更するために適応できると確信しています。フォーラムのリンクは次のとおりです。https://productforums.google.com/forum/#!topic/chrome/BnLnYe3SK8k(これは最良の回答としてマークされています) –

3

body{ 
 
background-color:#000; 
 
color:#fff; 
 
} 
 
h2::-moz-selection { /*Firefox*/ 
 
    color: #000; 
 
    background: #FF9800; 
 
} 
 
::-moz-selection { /*Firefox */ 
 
    color: #000; 
 
    background: yellow; 
 
} 
 
h2::selection { 
 
    color: #000; 
 
    background: #FF9800; 
 
} 
 
::selection { 
 
     color: #000; 
 
    background: yellow; 
 
}
<h2>Select some text on this page:</h2> 
 
<p>This is a paragraph.</p> 
 
<div>This is some text in a div element.</div>

+0

ダウンロードサンプルのリンク:https://ws.onehub.com/files/64lj8llt –

+0

これは変更されません。結果を見つける。選択色のみ –

関連する問題