Comment créer des balises personnalisées pour HTML

Comment créer des balises personnalisées pour HTML
Plusieurs balises en HTML peuvent être utilisées à diverses fins, telles que «"Pour faire des boutons et"”Pour ajouter des images dans des documents HTML. HTML permet également aux développeurs Web de créer des balises personnalisées ou indépendantes. Bien qu'il y ait peu de restrictions à créer une balise personnalisée valide. La balise personnalisée doit avoir une ouverture et une balise de clôture. De plus, les balises personnalisées à fermeture automatique ne sont pas valides en HTML.

Cet article démontrera:

  • Quelles sont les balises personnalisées pour HTML?
  • Quelles sont les règles de dénomination pour les balises personnalisées?
  • Exemples de balises personnalisées valides et non valides
  • Comment créer des balises personnalisées pour HTML?

Quelles sont les balises personnalisées pour HTML?

Les attributs personnalisés sont spécialement conçus par les développeurs ou les utilisateurs et ne sont pas inclus dans les éléments standard HTML5. Les balises personnalisées spécifient du contenu supplémentaire ou personnel dans les balises définies par l'utilisateur. Ces balises fonctionnent de manière similaire aux balises intégrées HTML. De plus, pour spécifier la balise personnalisée dans le document HTML, les utilisateurs doivent suivre les règles de dénomination.

Quelles sont les règles de dénomination pour les balises personnalisées?

Il existe différentes règles de dénomination définies pour créer la balise personnalisée. Certains d'entre eux sont énumérés ci-dessous:

  • Une balise personnalisée commence toujours par une petite lettre.
  • Les utilisateurs peuvent ajouter des valeurs numériques de (1 à 9) dans la balise personnalisée.
  • Au moins un (-) trait d'union doit être ajouté à la balise personnalisée.
  • Les utilisateurs ne peuvent pas entrer la lettre majuscule dans une balise personnalisée.
  • Les utilisateurs peuvent également utiliser n'importe quel type d'emoji dans la balise personnalisée.
  • Les utilisateurs ne peuvent pas créer des balises personnalisées à fermeture automatique ou en ligne dans le HTML.

Exemples de balises personnalisées valides et non valides
Le tableau suivant montre des exemples liés aux balises personnalisées valides et non valides:

Tags personnalisés valides Tags personnalisés non valides

Comment créer des balises personnalisées pour HTML?

Pour créer des balises personnalisées dans HTML, passez par les instructions fournies ci-dessous.

Étape 1: Créez une balise personnalisée
Tout d'abord, créez une balise personnalisée en suivant les règles de dénomination. Par exemple, nous avons créé l'élément «» dans HTML. Ensuite, ajoutez du texte entre les balises personnalisées.

Étape 2: Créer le bouton
Créez un bouton à l'aide de "”À l'intérieur de la balise personnalisée:


Ce conteneur a été créé par moi.



Ici, vous pouvez voir que la balise personnalisée a été créée avec succès et affiche également l'élément de bouton:

Étape 3: Élément personnalisé de style
Les utilisateurs peuvent également styliser le conteneur personnalisé en y accédant dans CSS en utilisant le nom de balise pertinent. Par exemple, nous avons accédé au conteneur personnalisé à l'aide de la balise créée "mamelle". Après cela, appliquez les propriétés ci-dessous sur la balise personnalisée:

My-Tag
bloc de visualisation;
Border: 4px vert massif;
marge: 30px 15px;
rembourrage: 30px;
Color en arrière-plan: RVB (238, 181, 96);

Ici:

  • "afficher»La propriété est utilisée pour spécifier comment afficher un élément. L'affichage est défini comme un «bloc”Pour afficher l'élément dans une nouvelle ligne.
  • "frontière«Est utilisé pour définir une frontière autour de l'élément.
  • "marge"Attribué un espace autour de la limite de l'élément.
  • "rembourrage”Définit un espace à l'intérieur de la limite d'un élément.
  • "Couleur de l'arrière plan"Est utilisé pour spécifier la couleur à l'arrière de l'élément.

Sortir

On peut observer que nous avons effectivement créé et stylé l'élément ou la balise personnalisée.

Conclusion

Pour créer une balise personnalisée, les utilisateurs sont limités en suivant les règles de dénomination. Pour créer une balise personnalisée, spécifiez d'abord la balise en fonction des règles telles que « Un contenu ". Ensuite, accédez à la balise dans CSS en utilisant le nom de la balise et appliquez les propriétés CSS pour le style. Ce tutoriel vous a appris la méthode la plus simple pour créer une balise personnalisée pour HTML.