4.14. Introduction au HTML : structure de base, balises et attributs : balises de division et d'étendue
HTML, qui signifie Hyper Text Markup Language, est le langage de balisage standard pour la création de pages Web et d'applications. Comprendre la structure de base du HTML, ainsi que les balises et les attributs, est essentiel pour tout développeur front-end. Dans cette section, nous nous concentrerons spécifiquement sur les balises division et span.
Structure de base du HTML
Un document HTML est structuré comme une arborescence d'éléments et de texte. Chaque document commence par un type de document suivi de la balise racine . Dans la balise , nous avons deux parties principales : le et le .
<!DOCTYPE html>
<html>
<head>
<title>Titre de la page</title>
≪/head>
<body>
Le contenu de la page va ici.
</body>
</html>
Le contient des métainformations sur le document, telles que son titre, des liens vers des scripts et des feuilles de style. Le contient le contenu réel de la page qui est visible par les utilisateurs.
Balises et attributs
Les balises HTML sont les éléments constitutifs de toute page Web. Ils définissent le type de contenu inséré et la manière dont il doit être affiché. Chaque balise commence par un crochet angulaire (<) et se termine par un crochet angulaire (>). La plupart des balises sont présentées par paires, avec une balise d'ouverture et une balise de fermeture.
Les attributs fournissent des informations supplémentaires sur les balises HTML. Ils se présentent sous forme de paires nom-valeur et sont toujours inclus dans la balise d'ouverture. Par exemple, la balise de lien peut avoir un attribut href qui indique l'URL vers laquelle le lien doit pointer.
<a href="https://www.example.com">Lien vers Exemple.com</a>
Balises de division et d'étendue
Les balises division
et span sont utilisées pour regrouper d'autres éléments HTML. La balise
est un élément de bloc utilisé pour regrouper des éléments de niveau bloc, tandis que la balise est un élément en ligne utilisé pour regrouper des éléments de niveau en ligne.
<div>
<p>Il s'agit d'un paragraphe dans un div.</p>
<p> Ceci est un autre paragraphe dans le même div.</p>
</div>
<p>Ceci est <span>texte en surbrillance</span> dans un paragraphe.</p>
Les deux balises sont souvent utilisées avec les attributs class et id pour appliquer des styles CSS ou des comportements JavaScript. Par exemple, vous pourriez avoir un div avec la classe "conteneur" auquel un certain style lui est appliqué.
<div class="conteneur">
<p>Il s'agit d'un paragraphe à l'intérieur d'un div avec la classe "conteneur".</p>
</div>
En bref, HTML est l'épine dorsale de toute page Web. Comprendre la structure de base du HTML et savoir comment utiliser les balises et les attributs est essentiel pour devenir un développeur front-end efficace. Les balises split et span sont particulièrement utiles pour regrouper des éléments et appliquer des styles ou des comportements à des groupes d'éléments.