Modification de la couleur de surbrillance lors de la sélection de texte dans une entrée de texte HTML

Question

Je cherchais cela sur le Web et je ne peux même pas trouver quelqu'un d'autre qui le lui demande, encore moins une solution ...

Est-il possible de changer la couleur de la zone de surbrillance dans une entrée de texte lorsque du texte est sélectionné? Pas la bordure en surbrillance ou l'arrière-plan, mais la partie qui apparaît autour du texte lorsque vous avez le texte sélectionné.

Answer 1

Si vous recherchez ceci:

Voici le lien:

http://css-tricks.com/overriding-the-default-text-selection-color-with-css/

Answer 2

c'est le code.

 1   /*** Works on common browsers ***/
2   ::selection {
3       background-color: #352e7e;
4       color: #fff;
5   }
6    
7   /*** Mozilla based browsers ***/
8   ::-moz-selection {
9       background-color: #352e7e;
10      color: #fff;
11  }
12   
13  /***For Other Browsers ***/
14  ::-o-selection {
15      background-color: #352e7e;
16      color: #fff;
17  }
18   
19  ::-ms-selection {
20      background-color: #352e7e;
21      color: #fff;
22  }
23   
24  /*** For Webkit ***/
25  ::-webkit-selection {
26      background-color: #352e7e;
27      color: #fff;
28  }
 

Answer 3

Je me rends compte que c’est une vieille question, mais pour tous ceux qui la rencontrent, ceci peut être fait en utilisant contenteditable comme indiqué dans ce JSFiddle .

Félicitations à Alex qui a mentionné cela dans les commentaires (je ne l'avais pas vu jusqu'à présent!)

Answer 4

@ Mike Eng,

Lors de la sélection de la couleur de fond du texte, vous pouvez modifier la couleur du texte à l’aide de :: selection . Notez que :: selection fonctionne en chrome. Pour que cela fonctionne dans les navigateurs Firefox, essayez celui-ci :: - moz-selection

Essayez l'extrait de code suivant dans reset.css ou la page css où vous souhaitez appliquer l'effet.

 ::selection{
   //Works only for the chrome browsers
   background-color: #CFCFCF; //This turns the background color to Gray
   color: #000; // This turns the selected font color to Black
}

::-moz-selection{
   //Works for the firefox based browsers
   background-color: #CFCFCF; //This turns the background color to Gray
   color: #000; // This turns the selected font color to Black
}
 

Le code ci-dessus fonctionnera même dans les zones de saisie.

Answer 5

http://css-tricks.com/overriding-the-default-text-selection-color-with-css/

MAIS U OBTENIRA UNE ERREUR W3C EN UTILISANT CE CSS.