Comment désactiver la sélection de texte à l'aide de CSS

Découvrez comment désactiver la sélection de texte à l'aide de la propriété CSSuser-select

Par défaut, les navigateurs nous permettent de sélectionner le texte dans le navigateur en utilisant le clavier, en appuyant sur la combinaison cmd-A sur un Mac par exemple, ou en utilisant la souris.

Comment pouvez-vous désactiver cela, pour que votre page Web se comporte davantage comme une application et moins comme un document?

Utilisez leuser-select: none;Règle CSS.

Vous devez utiliser des préfixes de navigateur, commehttps://caniuse.com/#feat=user-select-nonenous dit:

-webkit-touch-callout: none;
  -webkit-user-select: none;
   -khtml-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;

Une chose que j'utilise parfois est de rendre toute l'interface de l'application non sélectionnable en appliquantuser-select: none;sur l'élément body, alors je peux le réactiver sur des éléments spécifiques, en utilisant:

user-select: text;

Téléchargez mon gratuitManuel CSS


Plus de didacticiels CSS: