-
Notifications
You must be signed in to change notification settings - Fork 8k
/
index.md
87 lines (67 loc) · 1.85 KB
/
index.md
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
---
title: ":disabled"
slug: Web/CSS/:disabled
---
{{CSSRef}}
La [pseudo-classe](/fr/docs/Web/CSS/Pseudo-classes) **`:disabled`** permet de cibler un élément désactivé. Un élément est désactivé s'il ne peut pas être activé (sélectionné, cliqué ou saisi) ou s'il ne peut pas recevoir le focus de l'utilisateur. L'élément possède également un état activé dans lequel il peut être sélectionné ou recevoir le focus.
```css
/* Cible tous les champs de saisie texte */
/* qui sont désactivés */
input[type="text"]:disabled {
background: #ccc;
}
```
## Syntaxe
{{csssyntax}}
## Exemples
### CSS
```css
input[type="text"]:disabled {
background: #ccc;
}
```
### HTML
```html
<form action="#">
<fieldset>
<legend>Adresse de livraison</legend>
<input type="text" placeholder="Nom" />
<input type="text" placeholder="Adresse" />
<input type="text" placeholder="Code postal" />
</fieldset>
<fieldset id="facturation">
<legend>Adresse de facturation</legend>
<label for="facturation_livraison"
>Identique à l'adresse de livraison</label
>
<input
type="checkbox"
id="facturation_livraison"
onchange="javascript:toggleBilling()"
checked />
<br />
<input type="text" placeholder="Nom" disabled />
<input type="text" placeholder="Adresse" disabled />
<input type="text" placeholder="Code postal" disabled />
</fieldset>
</form>
```
### JavaScript
```js
function toggleBilling() {
var billingItems = document.querySelectorAll(
'#facturation input[type="text"]',
);
for (var i = 0; i < billingItems.length; i++) {
billingItems[i].disabled = !billingItems[i].disabled;
}
}
```
### Résultat
{{EmbedLiveSample('Exemples', '300px', '250px')}}
## Spécifications
{{Specifications}}
## Compatibilité des navigateurs
{{Compat}}
## Voir aussi
- {{cssxref(":enabled")}}