Exécuter
❯
Exécuter le code
Ctrl+Alt+R
Enregistrer le code
Ctrl+Alt+A
Changer d'orientation
Ctrl+Alt+O
Changer de thème
Ctrl+Alt+D
<!DOCTYPE html> <html> <head> <style> label {display: block;} input[type=text] { largeur: 100%; padding: 12px; marge: 8px 0; box-sizing: border-box; bordure: 3px solide #ccc; transition: 0.5s; contour: aucun; } input[type=text]:focus { bordure: 3px solide #555; } </style> </head> <body> <h2>Champs de saisie avec bordure noire sur :focus</h2> <p>Ici, le champ de saisie obtient une couleur de bordure noire lorsqu'il reçoit le focus (cliqué dessus). Nous avons également ajouté la propriété de transition CSS pour animer la couleur de la bordure (prend 0,5 seconde pour changer la couleur au focus) :</p> <form> <label for="fname">Prénom</label> <input type="text" id="fname" name="fname" value="John"> <label for="lname">Nom de famille</label> <input type="text" id="lname" name="lname" value="Doe"> </form> </body> </html>