Lors du développement d'un site Web, il est nécessaire de placer des éléments de manière organisée, en particulier lors de la création d'un composant qui contient un texte supplémentaire. Dans l'autre cas, si le texte est désorganisé, cela entraînera des problèmes de lisibilité. Pour éviter ce problème, HTML propose une balise qui peut être utilisée dans le but spécifié.

Ce manuel fournira un guide sur l'élément HTML. Alors, commençons!

Avant de se précipiter dans la discussion liée au sujet de l'article, voyons un exemple démontrant l'élément sans utiliser une étiquette de résumé.

Comment l'élément affiche le contenu sans l'élément?

Dans l'exemple suivant, nous afficherons le contenu à l'aide du «détails”Tag sans l'élément résumé:

Ceci est une explication détaillée.

Par défaut, l'élément affiche un détail de cap qui n'est pas significatif seul:

À partir de la sortie ci-dessus, on peut observer comment l'élément de détails fonctionne sans l'élément HTML.

Dans la section suivante, l'utilisation appropriée de la balise HTML sera discutée.

Qu'est-ce que la balise HTML?

Dans HTML, le «»L'élément est utilisé à l'intérieur de l'élément pour spécifier un titre. Ce titre est cliquable pour afficher ou masquer les détails.

Syntaxe

contenu…

Détails du contenu…

Vous trouverez ci-dessous la description de la syntaxe susmentionnée:

• • "»L'élément spécifie les informations supplémentaires.
  • ""L'élément spécifie un titre visible qui est cliqué pour afficher ou masquer les détails.

Maintenant, dirigez-vous vers l'exemple suivant.

Exemple: comment ajouter une balise en html?

Dans HTML, ajoutez d'abord un élément div avec le nom de classe "FAQ". Puis ajouter

élément pour ajouter une rubrique sur la page Web. Après cela, Place Tag, qui contient les informations détaillées. À l'intérieur de cet élément, l'élément est utilisé pour spécifier le titre. Nous en ajouterons deux autres "détails»Éléments de la même manière.

Html

Questions fréquemment posées

Comment puis-je acheter un produit?

Vous pouvez obtenir le produit en cliquant simplement sur le bouton Ajouter au panier et procéder avec paiement.

Combien de temps dure la livraison?

Vous pouvez recevoir votre produit en deux à trois jours ouvrables.

Acceptez-vous de l'argent à la livraison?

Oui.

CSS

Dans CSS, les éléments HTML sont fournis avec différentes propriétés de style.

Style tous les éléments

*
Font-Family: Verdana, Genève, Tahoma, Sans-Serif;

L'extrait de code ci-dessus représente que le «famille de polices»Avec la valeur Verdana, Genève, Tahoma, Sans-Serif est appliqué à tous les éléments. De plus, la liste des styles de police est utilisée à des fins que si le navigateur ne prend pas en charge le premier, il appliquera le second, et ainsi de suite.

FAQ de style div

.faqs
Largeur: 500px;
hauteur: 300px;
marge: 0 auto;
rembourrage: 20px;
Color en arrière-plan: # B73E3E;
curseur: pointeur;
Couleur: Ghostwhite;
taille de police: 15px;

Les propriétés suivantes sont appliquées à l'élément avec le nom de la classe "FAQ:

• • "largeur”La propriété est utilisée pour le réglage de la largeur de l'élément.
  • "hauteur”La propriété est utilisée pour le réglage de la hauteur de l'élément.
  • "marge«Propriété avec valeur»0 Auto”Indique l'espace 0px en haut et en bas et un espace égal sur le côté gauche et droit de l'élément div.
  • "rembourrage«Propriété avec une valeur de«20px»Produit un espace 20px autour du contenu de l'élément div.
  • "Couleur de l'arrière plan«La propriété est utilisée pour le réglage de l'arrière-plan de l'élément.
  • "le curseur»Pointer affiche la souris comme une main avec un doigt point.
  • "couleur»La propriété définit la couleur de la police à Ghostwhite.
  • "taille de police»La propriété ajuste la taille de la police à 15px.

Style H1 élément de FAQs div

.faqs h1
Couleur: # ffe4bb;
Décoration du texte: soulignement 2px wavy;

Le ".FAQ H1"Est référé au

Tag de FAQs div. L'explication des propriétés appliquées est décrite ci-dessous:

• • "couleur»La propriété définit la couleur de la police.
  • "textaine-décoration"La propriété est définie avec la valeur"souligner 2px wavy"Où souligne la propriété de décoration texte, 2px est la largeur de la ligne, et ondulé est le style.

Élément de détails de style

détails
rembourrage: 5px;

L'élément est appliqué avec le «rembourrage»Propriété qui applique un espace autour du contenu de l'élément div.

Élément de résumé du style

résumé
rembourrage: 6px;
taille de police: 20px;
Couleur: Whitesmoke;

L'élément est appliqué avec des styles CSS qui sont décrits ci-dessous:

• • "rembourrage«Propriété avec valeur»6px”Produire de l'espace autour du contenu de l'élément récapitulatif.
  • "taille de police»La propriété définit la taille de la police.
  • "couleur»La propriété applique le«fumée blanche”Couleur à la police.

En fournissant le code ci-dessus, notre page Web ressemblera à ceci:

On peut observer qu'un résumé de chacun des points donnés a été associé avec succès.

Conclusion

HTML nous permet d'utiliser le «»Élément qui affiche l'en-tête qui peut afficher ou masquer les détails en cliquant. Cet élément HTML peut être utilisé pour organiser le contenu et augmenter le contenu global de la page Web. Cet article a réussi à démontrer ce qu'est une balise de résumé HTML et comment elle peut être insérée dans un fichier HTML.