Désactiver la sélection de texte d'une page web avec CSS
Par JEAN PAUL ADENIS, publié le jeudi 26 mai 2022 15:54 - Mis à jour le jeudi 26 mai 2022 16:12
Pour empêcher la sélection de texte dans une page html et donc le copier-coller.
Passer en mode source
Ajouter le style ci-dessous (tout au début de la page) :
<style>
.unselectable {
-webkit-user-select: none;
-webkit-touch-callout: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
color: #cc0000; /* couleur du texte */
}
</style>
Un texte ordinaire (pas de style) :
Je suis un texte sélectionnable. Tu peux me sélectionner.
Appliquer le style sur le texte à " protéger " :
<div class="unselectable">Je suis un texte non sélectionnable. Ma sélection de texte est désactivée.</div>
Ce qui donne :
Je suis un texte sélectionnable. Tu peux me sélectionner.
Je suis un texte non sélectionnable. Ma sélection de texte est désactivée.
Catégories
- Publication - pour aller plus loin