From 258ba7b4be62d8640477a3bd3146d08b00cb70ec Mon Sep 17 00:00:00 2001 From: julieng Date: Fri, 17 Sep 2021 20:59:20 +0200 Subject: convert content to md --- files/fr/web/css/_colon_indeterminate/index.md | 153 +++++++++++-------------- 1 file changed, 67 insertions(+), 86 deletions(-) (limited to 'files/fr/web/css/_colon_indeterminate') diff --git a/files/fr/web/css/_colon_indeterminate/index.md b/files/fr/web/css/_colon_indeterminate/index.md index a94a588e4b..59ad1c0db6 100644 --- a/files/fr/web/css/_colon_indeterminate/index.md +++ b/files/fr/web/css/_colon_indeterminate/index.md @@ -7,119 +7,100 @@ tags: - Reference translation_of: Web/CSS/:indeterminate --- -
{{CSSRef}}
+{{CSSRef}} -

La pseudo-classe :indeterminate permet de cibler un élément de formulaire dont l'état est indéterminé.

+La [pseudo-classe](/fr/docs/Web/CSS/Pseudo-classes) **`:indeterminate`** permet de cibler un élément de formulaire dont l'état est indéterminé. -
/* Cible n'importe quel élément <input> */
+```css
+/* Cible n'importe quel élément  */
 /* dans un état indéterminé */
 input:indeterminate {
   background: lime;
-}
+} +``` -

Cela inclut :

+Cela inclut : - +- un élément [``](/fr/docs/Web/HTML/Element/Input/checkbox) dont la propriété du DOM `indeterminate` est fixée à `true` via du code JavaScript +- des éléments [``](/fr/docs/Web/HTML/Element/Input/radio) dont tous les boutons radio du groupe sont décochés +- des éléments {{HTMLElement("progress")}} dans un état indéterminé. -

Syntaxe

+## Syntaxe {{csssyntax}} -

Exemples

+## Exemples -

Case à cocher et bouton radio

+### Case à cocher et bouton radio -

CSS

+#### CSS -
input, span {
+```css
+input, span {
   background: red;
 }
 
 :indeterminate, :indeterminate + label {
   background: lime;
 }
-
- -

HTML

- -
<div>
-  <input type="checkbox" id="checkbox">
-  <label for="checkbox">L'arrière-plan devrait être vert.</label>
-</div>
-<div>
-  <input type="radio" id="radio">
-  <label for="radio">L'arrière-plan devrait être vert.</label>
-</div>
- -

JavaScript

- -
var inputs = document.getElementsByTagName("input");
-for(var i = 0; i < inputs.length; i++) {
+```
+
+#### HTML
+
+```html
+

+  
+  
+

+

+  
+  
+

+```
+
+#### JavaScript
+
+```js
+var inputs = document.getElementsByTagName("input");
+for(var i = 0; i < inputs.length; i++) {
   inputs[i].indeterminate = true;
 }
-
+``` -

Résultat

+#### Résultat -

{{EmbedLiveSample('Case_à_cocher_et_bouton_radio', '100%', 50)}}

+{{EmbedLiveSample('Case_à_cocher_et_bouton_radio', '100%', 50)}} -

Élément progress

+### Élément `progress` -

CSS

+#### CSS -
progress:indeterminate {
+```css
+progress:indeterminate {
   opacity: 0.5;
   box-shadow: 0 0 2px 1px red;
 }
-
- -

HTML

- -
<progress/>
-
- -

Résultat

- -

{{EmbedLiveSample('Élément_progress', '100%', 30)}}

- -

Spécifications

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpécificationÉtatCommentaires
{{SpecName('HTML WHATWG', '#selector-indeterminate', ':indeterminate')}}{{Spec2('HTML WHATWG')}}Aucune modification.
{{SpecName('HTML5 W3C', '#selector-indeterminate', ':indeterminate')}}{{Spec2('HTML5 W3C')}}Définition de la sémantique relative à HTML et des contraintes de validation associées.
{{SpecName('CSS4 Selectors', '#indeterminate', ':indeterminate')}}{{Spec2('CSS4 Selectors')}}Aucune modification.
{{SpecName('CSS3 Basic UI', '#indeterminate', ':indeterminate')}}{{Spec2('CSS3 Basic UI')}}Définition de la pseudo-classe, sans notion de sémantique associée.
- -

Compatibilité des navigateurs

- -

{{Compat("css.selectors.indeterminate")}}

+``` + +#### HTML + +```html + +``` + +#### Résultat + +{{EmbedLiveSample('Élément_progress', '100%', 30)}} + +## Spécifications + +| Spécification | État | Commentaires | +| ------------------------------------------------------------------------------------------------ | ------------------------------------ | --------------------------------------------------------------------------------------- | +| {{SpecName('HTML WHATWG', '#selector-indeterminate', ':indeterminate')}} | {{Spec2('HTML WHATWG')}} | Aucune modification. | +| {{SpecName('HTML5 W3C', '#selector-indeterminate', ':indeterminate')}} | {{Spec2('HTML5 W3C')}} | Définition de la sémantique relative à HTML et des contraintes de validation associées. | +| {{SpecName('CSS4 Selectors', '#indeterminate', ':indeterminate')}} | {{Spec2('CSS4 Selectors')}} | Aucune modification. | +| {{SpecName('CSS3 Basic UI', '#indeterminate', ':indeterminate')}} | {{Spec2('CSS3 Basic UI')}} | Définition de la pseudo-classe, sans notion de sémantique associée. | + +## Compatibilité des navigateurs + +{{Compat("css.selectors.indeterminate")}} -- cgit v1.2.3-54-g00ecf