CSSのバグのダブルクリックは、テキストのイメージとヘッダーの背景とフォントの色を変更します

Question

この写真のようにダブルクリックすると色と背景が変わることはありません私はそれを疑ったときに白と背景を青にしました。どのように私はこの問題を解決することができますか？お使いのブラウザのデフォルトの選択行動だ

Answer 1

あなたが言及しているのは、CSS ::selection属性です。色は実際に変化していません。これは、ユーザーがテキストを選択してコピーするのを支援するネイティブブラウザの動作です。あなたはそれを取り除くことができますが、あなたは非常に重要なユーザビリティのパターンを破ることになることを理解する必要があります。人々は、たとえそれがそこに存在するはずの定型化されていても、選択が機能することを期待しています。

この動作を無効にしないでください。本当に必要な場合は、デザインに合わせてカスタマイズすることを強くお勧めします。

p::selection { 
 
    color: red; 
 
    background: yellow; 
 
} 
 

 
div::selection { 
 
    color: green; 
 
    background: blue; 
 
}

<p>Questions that may already have your answer</p> 
 

 
<div>Another option of text highlight</div>

Answer 2

。選択を完全に無効にする場合は、要素にuser-select: none;を使用できます。