Balise DETAIlS
Rôle
La balise <détails> permet d’afficher ou de masquer du contenu à la demande. C’est une balise qui suggère une action de la part de l’internaute (celle de cliquer). Vous pouvez intégrer tout type de contenu (texte, image, média..).
La balise <détails> fonctionne avec la balise <summary> qui est le premier élément visible sur lequel on va cliquer.
Testez vous-même cette balise
Utilisez Codepen.
See the Pen EowGze by salsacobo (@salsacobo) on CodePen.
Voici le résultat : cliquez sur le mot produit1 pour ouvrir ou fermer le détails du produit
See the Pen EowGze by salsacobo (@salsacobo) on CodePen.
Compatibilité
La balise <détails> n’est pris en charge par le navigateur internet explorer et edge.
Attributs spécifiques
Attributs spécifiques à cet élément
- open
- Spécifie que les détails doivent être visibles (ouverture) pour l’utilisateur
Syntaxe :
See the Pen goGqrM by salsacobo (@salsacobo) on CodePen.
Affichage :
See the Pen goGqrM by salsacobo (@salsacobo) on CodePen.
La balise <details> prend aussi en charge les attributs globaux
Attributs de type événement
La balise <details> prend en charge les événements souris
