From 149319bb8c7b1394a443f0877c3460cd362aa815 Mon Sep 17 00:00:00 2001 From: julieng Date: Fri, 17 Sep 2021 20:58:15 +0200 Subject: move *.html to *.md --- files/fr/web/css/user-select/index.md | 135 ++++++++++++++++++++++++++++++++++ 1 file changed, 135 insertions(+) create mode 100644 files/fr/web/css/user-select/index.md (limited to 'files/fr/web/css/user-select/index.md') diff --git a/files/fr/web/css/user-select/index.md b/files/fr/web/css/user-select/index.md new file mode 100644 index 0000000000..6415ba1753 --- /dev/null +++ b/files/fr/web/css/user-select/index.md @@ -0,0 +1,135 @@ +--- +title: user-select +slug: Web/CSS/user-select +tags: + - CSS + - Propriété + - Reference +translation_of: Web/CSS/user-select +--- +
{{CSSRef}}
+ +

La propriété user-select permet de contrôler l'opération de sélection. Cela n'a aucun effet sur le contenu qui est chargé dans les éléments de l'interface ({{Glossary("Chrome", "chrome")}}), sauf pour les boîtes de texte.

+ +
/* Valeurs avec un mot-clé */
+user-select: none;
+user-select: auto;
+user-select: text;
+user-select: contain;
+user-select: all;
+
+/* Valeurs globales */
+user-select: inherit;
+user-select: initial;
+user-select: unset;
+
+/* Valeurs spécifiques à Mozilla */
+-moz-user-select: none;
+-moz-user-select: text;
+-moz-user-select: all;
+
+/* Valeurs spécifiques à WebKit */
+-webkit-user-select: none;
+-webkit-user-select: text;
+-webkit-user-select: all; /* Ne fonctionne pas pour Safari */
+
+/* Valeurs spécifiques à Microsoft */
+-ms-user-select: none;
+-ms-user-select: text;
+-ms-user-select: element;
+
+ +

Syntaxe

+ +
+
none
+
On ne pourra pas sélectionner le texte de l'élément et celui de ses descendants. Toutefois, l'objet {{domxref("Selection")}} pourra contenir ces éléments. À partir de Firefox 21, none se comporte comme -moz-none et la sélection peut donc être réactivée sur les éléments fils avec -moz-user-select:text.
+
auto
+
+

Le texte sera sélectionné avec les propriétés par défaut appliquées par l'agent utilisateur. La valeur calculée est déterminée de la façon suivante :

+ +
    +
  • Pour les pseudo-éléments ::before et ::after, la valeur calculée sera none
    • +
  • Si l'élément est un élément éditable, la valeur calculée est contain
    • +
  • Sinon, si la valeur calculée de  user-select pour l'élément parent est all, la valeur calculée sera all
    • +
  • Sinon, si la valeur calculée de  user-select pour l'élément parent est all, la valeur calculée sera none
    • +
  • Sinon, la valeur calculée est text
    • +
+
+
text
+
Le texte peut être sélectionné par l'utilisateur.
+
all
+
Dans un éditeur HTML, si un double clic ou si un clic contextuel se produit sur les éléments fils, c'est la valeur de l'ancêtre le plus haut qui sera sélectionnée.
+
contain
+
element {{non-standard_inline}} (alias spécifique à IE)
+
Uniquement supporté par Internet Explorer. Cela permet d'activer la sélection au sein de l'élément, celle-ci ne pourra pas « sortir » de cet élément.
+
+ +
+

Note : CSS UI 4 a renommé user-select: element en contain.

+
+ +

Syntaxe formelle

+ +{{csssyntax}} + +

Exemples

+ +

CSS

+ +
.unselectable {
+  -moz-user-select: none;
+  -webkit-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+
+.all {
+  -moz-user-select: all;
+  -webkit-user-select: all;
+  -ms-user-select: all;
+  user-select: all;
+}
+
+ +

HTML

+ +
<p>Vous devriez pouvoir sélectionner ce texte.</p>
+<p class="unselectable">Hop, vous ne pouvez pas sélectionner ce texte !</p>
+<p class="all">Cliquer une fois permettra de sélectionner l'ensemble du texte.</p>
+
+ +

Résultat

+ +

{{EmbedLiveSample("Exemples")}}

+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationÉtatCommentaires
{{SpecName('CSS4 UI', '#propdef-user-select', 'user-select')}}{{Spec2('CSS4 UI')}}Définition initiale. -webkit-user-select est indiqué comme étant un alias déprécié de user-select.
+ +

Compatibilité des navigateurs

+ +

{{Compat("css.properties.user-select")}}

+ +

Voir aussi

+ + -- cgit v1.2.3-54-g00ecf