English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
La pseudo-classe CSS :enabled représente tout élément activé (activé). Si un élément peut être activé (tel que sélectionné, cliqué ou accepter l'entrée de texte) ou obtenir le focus, alors cet élément est activé. Un élément a également un état désactivé (état désactivé), lorsqu'il est désactivé, l'élément ne peut pas être activé ou obtenir le focus.
Manuel complet des sélecteurs CSS
Définir la couleur du texte pour tous les champs de type="text" activés :
!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Tutoriel de base(oldtoolbag.com)</title>
<style>
input:enabled {
couleur: #22AA22;
}
input:disabled {
couleur: #D9D9D9;
}
</style>
</head>
<body>
<form action="url_of_form">
<label for="FirstField">Premier champ (activé):</label> <input type="text" id="FirstField" value="Lorem"><br />
<label for="SecondField">Deuxième champ (désactivé):</label> <input type="text" id="SecondField" value="Ipsum" disabled="disabled"><br />
<input type="submit" value="Submit" />
</form>
</body>
</html>Testez et voyez ‹/›Sélecteur :enabled qui correspond à chaque élément activé (utilisé principalement pour les éléments de formulaire).
Les nombres dans le tableau indiquent la première version du navigateur prenant en charge cette propriété.
| Sélecteur | |||||
|---|---|---|---|---|---|
| :enabled | 4.0 | 9.0 | 3.5 | 3.2 | 9.6 |
Définir la couleur de fond pour tous les éléments d'entrée activés :
!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Tutoriel de base(oldtoolbag.com)</title>
<style>
input:enabled
{
background:#ffff00;
}
input:disabled
{
background:#dddddd;
}
</style>
</head>
<body>
<form action="">
Prénom: <input type="text" value="Mickey" /><br>
Nom de famille: <input type="text" value="Mouse" /><br>
Pays: <input type="text" disabled="disabled" value="Disneyland" /><br>
Mot de passe: <input type="password" name="password" />
<input type="radio" value="masculin" name="gender" /> Masculin<br>
<input type="radio" value="femelle" name="gender" /> Féminin<br>
<input type="checkbox" value="Bicyclette" /> Je possède une bicyclette<br>
<input type="checkbox" value="Voiture" /> Je possède une voiture
</form>
</body>
</html>Testez et voyez ‹/›