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> ul { list-style-type: none; marge: 0; padding: 0; largeur: 200px; couleur de fond: #f1f1f1; } li a { afficher: bloc; couleur: noir; padding: 8px 16px; text-decoration: none; } li a.active { couleur-de-fond: #D74444; couleur: blanc; } li a:hover:not(.active) { couleur de fond: #555555; couleur: blanc; } </style> </head> <body> <h2>État Actif</h2> <p>Dans cet exemple, nous créons une classe "active" avec une couleur de fond verte et un texte blanc. La classe est ajoutée au lien "Home".</p> <ul> <li><a class="active" href="#home">Accueil</a></li> <li><a href="#news">Actualités</a></li> <li><a href="#contact">Contact</a></li> <li><a href="#about">À propos</a></li> </ul> </body> </html>