Cours IT Bases HTML 010_Éléments, Attributs - Notes techniques de zhaoJian

Éléments

Balise d’ouverture	Contenu de l’élément	Balise de fermeture
`<h1>`	Ceci est un titre	`</h1>`
`<p>`	Ceci est un paragraphe	`</p>`
`<a href="https://www.zhaojian.net/" title="Lien">`	Ceci est un lien	`</a>`
`<img src="/images/logo.png" alt="Ceci est une image">`	Ceci est une image
`<br>`	Saut de ligne

1
<!DOCTYPE html>
2
<html lang="en">
3

4
    <head>
5
        <meta charset="UTF-8" />
6
        <title>hello HTML</title>
7
    </head>
8

9
    <body>
10
        <h1>Ceci est un titre</h1>
11
        <p>
12
            Ceci est un paragraphe<br>
13
            <a href="https://www.zhaojian.net/" title="Lien">Ceci est un lien</a>
14
        </p>
15
        <img src="/images/logo.png" alt="Ceci est une image" />
16
        <br />
17
    </body>
18

19
</html>

[!Résumé]

Les éléments HTML commencent par une balise d’ouverture (début) et se terminent par une balise de fermeture (fin)

Le contenu d’un élément HTML est le contenu entre la balise d’ouverture et la balise de fermeture

Certains éléments HTML ont un contenu vide (empty content). Ces éléments sans contenu et sans balise de fermeture sont appelés balises vides ou éléments vides, pour implémenter des fonctionnalités spécifiques tout en maintenant simplicité et flexibilité, comme : <br>, <hr>, <img>, <meta>, <input>, etc.

La plupart des éléments HTML peuvent avoir des attributs

Les éléments HTML sont généralement appelés balises HTML (HTML tag)

Les éléments HTML apparaissent généralement par paires, par exemple <p> et </p>

Les éléments HTML peuvent imbriquer d’autres balises HTML

Les éléments HTML ne sont pas sensibles à la casse, l’utilisation de minuscules est recommandée

Attributs

Les éléments HTML peuvent avoir des attributs (Attribute) qui fournissent plus d’informations sur l’élément ou définissent certains comportements de l’élément. Les attributs sont toujours définis dans la balise d’ouverture et apparaissent généralement sous la forme “nom_attribut=valeur_attribut”. Par exemple, l’élément de lien (a) peut utiliser l’attribut href pour spécifier l’adresse de destination du lien :

Exemple :

1
<a href="https://www.zhaojian.net">zhaoJian.Net</a>

Résultat :

Effet de l'exemple

Dans le code ci-dessus, l’attribut href de l’élément a a la valeur "https://www.zhaojian.net", ce qui signifie que lorsque l’on clique sur ce lien, le navigateur accédera à cette URL.

Attributs couramment utilisés :

id : Fournit un identifiant unique pour l’élément.
class : Fournit un ou plusieurs noms de classe pour l’élément. Différents éléments peuvent avoir le même nom de classe.
style : Fournit des styles en ligne pour l’élément.
title : Ajoute un contenu de titre à l’élément de lien.
alt : Ajoute un contenu descriptif à l’élément d’image.

[!Résumé]

Les attributs apparaissent toujours sous forme de paires nom-valeur, par exemple : name="value".

Un espace doit être inséré entre l’attribut et le nom de l’élément (ou l’attribut précédent, s’il y a plus d’un attribut).

Les valeurs d’attributs doivent toujours être entre guillemets. Les guillemets doubles sont les plus couramment utilisés, mais l’utilisation de guillemets simples est également acceptable.

Les attributs et les valeurs d’attributs ne sont pas sensibles à la casse, l’utilisation de minuscules est recommandée.

Éléments

Attributs

Commentaires