Le langage HTML comprend un certain nombre d'éléments. Ceux-ci incluent couramment utilisés composants de site Web comme des paragraphes, des titres, des liens et des images. Il existe également un certain nombre d'éléments plus récents qui ont été introduits avec HTML5, notamment l'en-tête, la navigation, le pied de page, etc. Tous ces éléments HTML sont utilisés pour créer la structure d'un document et lui donner du sens. Pour ajouter encore plus de sens aux éléments, vous pouvez leur donner des attributs.
Une balise d'ouverture HTML de base commence par le caractère <. cela est suivi du nom de la balise et enfin vous compl avec le caract>. Par exemple, la balise d'ouverture du paragraphe s'écrirait comme ceci :
Pour ajouter un attribut à votre balise HTML, vous mettez d'abord un espace après le nom de la balise (dans ce cas c'est le "p"). Ensuite, vous ajouteriez le nom d'attribut que vous souhaitez utiliser suivi d'un signe égal. Enfin, la valeur de l'attribut serait placée entre guillemets. Par example:
Les balises peuvent avoir plusieurs attributs. Vous sépareriez chaque attribut des autres par un espace.
Éléments avec attributs requis
Certains éléments HTML nécessitent en fait des attributs si vous voulez qu'ils fonctionnent comme prévu. L'élément image et l'élément link en sont deux exemples.
le élément d'image nécessite l'attribut "src". Cet attribut indique au navigateur quelle image vous souhaitez utiliser à cet emplacement. La valeur de l'attribut serait un chemin de fichier vers l'image. Par example:
Vous remarquerez que nous avons ajouté un autre attribut à cet élément, l'attribut "alt" ou texte alternatif. Ce n'est pas techniquement un attribut obligatoire pour les images, mais c'est une bonne pratique de toujours inclure ce contenu pour l'accessibilité. Le texte répertorié dans la valeur de l'attribut alt est ce qui s'affichera si un l'image ne se charge pas pour certaines raisons.
Un autre élément qui nécessite des attributs spécifiques est la balise d'ancrage ou de lien. Cet élément doit inclure l'attribut "href", qui signifie "référence hypertexte". ce lien devrait disparaître." Tout comme l'élément image doit savoir quelle image charger, la balise link doit savoir où elle doit aimer à. Voici à quoi peut ressembler une balise de lien:
Ce lien amènerait désormais une personne au site Web spécifié dans la valeur d'un attribut. Dans ce cas, il s'agit de la page principale de Dotdash.
Attributs en tant que crochets CSS
Une autre utilisation des attributs est lorsqu'ils sont utilisés comme « crochets » pour Styles CSS. Parce que les normes Web imposent que la structure de votre page (HTML) soit séparée de ses styles (CSS), vous utilisez ces crochets d'attribut dans le CSS pour dicter la façon dont la page structurée s'affichera sur le Web le navigateur. Par exemple, vous pourriez avoir ce morceau de balisage dans votre document HTML.
Si vous vouliez que cette division ait une couleur de fond noire (#000) et une taille de police de 1.5em, vous ajouteriez ceci à votre CSS:
.featured { background-color: #000; taille de police: 1,5 em;}
L'attribut de classe "en vedette" agit comme un crochet que nous utilisons dans le CSS pour appliquer des styles à cette zone. Nous pourrions également utiliser un attribut ID ici si nous le voulions. Les classes et les ID sont des attributs universels, ce qui signifie qu'ils peuvent être ajoutés à n'importe quel élément. Ils peuvent également tous deux être ciblés avec des styles CSS spécifiques pour déterminer l'apparence visuelle de cet élément.
Concernant Javascript
Enfin, l'utilisation d'attributs sur certains éléments HTML est également quelque chose que vous pouvez utiliser en Javascript. Si vous avez un script qui recherche un élément avec un attribut ID spécifique, c'est encore une autre utilisation de cette partie commune du langage HTML.