Non standard
Cette fonctionnalité n'est ni standard, ni en voie de standardisation. Ne l'utilisez pas pour des sites accessibles sur le Web : elle ne fonctionnera pas pour tout utilisateur. Il peut également y avoir d'importantes incompatibilités entre les implémentations et son comportement peut être modifié dans le futur.
La propriété CSS -ms-user-select
est une propriété spécifique à Microsoft qui indique sur quelle zone d'un élément l'utilisateur peut sélectionner le texte de l'élément.
Syntax
Valeurs
none
-
Empêche la sélection de commencer sur l'élément. Cette valeur n'empêche pas une sélection déjà initiée de continuer sur l'élément.
element
-
Active la sélection au sein de l'élément. Toutefois, la sélection est limitée aux bords de l'élément.
text
-
Active la sélection au sein de l'élément et permet de poursuivre la sélection à l'extérieur de l'élément.
Syntaxe formelle
Exemples
Dans l'exemple suivant, on utilise le scénario d'un blog avec un conteneur qui est un élément <div>
avec un identifiant blog
. Ce conteneur contient un autre élément <div>
avec l'identifiant blogPost
pour le billet de la page. La classe comment
est appliquée aux éléments <div>
qui sont des commentaires. Le billet de blog contient un élément <input>
et un élément <textarea>
pour ajouter un commentaire.
La déclaration suivante désactive la sélection à l'exception du contenu éditable.
#blog {
-ms-user-select: none;
-webkit-user-select: none;
-moz-user-select: -moz-none;
}
La déclaration suivante désactive la sélection pour le reste :
#blog, #blog input, #blog textarea,
#blog *[contenteditable=true] {
-ms-user-select: none;
-webkit-user-select: none;
-moz-user-select: -moz-none;
}
La déclaration suivante permet aux utilisateurs de ne sélectionner que le contenu du billet.
#blogPost {
-ms-user-select: element;
-webkit-user-select: text;
-moz-user-select: text;
}
#blog {
-ms-user-select: none;
-webkit-user-select: none;
-moz-user-select: -moz-none;
}
La déclaration suivante permet aux utilisateurs de ne sélectionner que les commentaires.
.comment {
-ms-user-select: element;
-moz-user-select: text;
-webkit-user-select: text;
}
#blog{
-ms-user-select: none;
-moz-user-select: -moz-none;
-webkit-user-select: none;
}
Le code suivan permet de commencer la sélection sur le billet ou sur l'un des commentaires et de poursuivre sur la suite.
#blogPost, .comment {
-ms-user-select: text;
}
#blog {
-ms-user-select: none;
}
Spécifications
Cette propriété est une propriété non-standard qui ne fait partie d'aucune spécification.
Valeur initiale | text |
---|---|
Applicabilité | non-replaced elements |
Héritée | non |
Média | interactif |
Valeur calculée | comme spécifié |
Type d'animation | discrète |
Ordre canonique | l'ordre unique et non-ambigu défini par la grammaire formelle |