Apprendre le langage HTML/CSS

• Les éléments en HTML

Un code est composé d'éléments. Ils servent à définir quelque chose comme un paragraphe ou un titre par exemple, ou à insérer quelque chose comme une image.

• Les balises en HTML

Un élément possède une syntaxe particulière et une composition précise. Un élément est composé de balises. Il y a deux types de balises : les balises simples, dites orphelines, et les balises doubles qui fonctionnent par paire et viennent encadrer un contenu.

• La balise double

Une balise double est composée, comme son nom l'indique, est composée de deux balises : une balise ouvrante et une balise fermante. Entre les deux balises, il y a ce qu'on appelle le contenu, donc le texte et les informations des balises orphelines. La balise sert à définir un objet, à lui indiquer quoi afficher au final.

Prenons l'exemple de la double balise .div . Elle va s'écrire de la manière suivante (voir photo)


Le contenu peut être divers et varié, qu'il soit textuel ou image. Chaque balise possède ses caractéristiques propres et peuvent être complétée par des attributs.

• La balise orpheline

Une balise orpheline, aussi appelée balise auto-fermante, va venir apporter une information simple. Elle sert pour insérer un objet comme un saut de ligne ou une image à un endroit précis. Prenons par exemple la balise .br . Un saut de ligne va s'écrire de la manière suivante (voir image).


Placé entre deux autres éléments, il va permettre d'insérer un saut de ligne. La balise img fonctionne de la même manière à la différence que cette balise est composée d'un attribut qui sert à définir. Il peut également orthographier cette balise avec un slash avant ou après le nom de la balise.

Une balise possède une syntaxe précise. Elle est encadrée de chevrons simples le nom de la balise. Un slash placé après le premier chevron de la balise fermante qui va venir la différencier de la balise ouvrante.

• Les attributs en HTML

Une balise peut contenir des attributs, c'est-à-dire des morceaux de code qui vont venir compléter la balise, y apporter des informations supplémentaires comme le style à apporter ou le lien à suivre.

Prenons le cas de la balise orpheline .img . La balise sert à insérer une image. Elle aura besoin de deux attributs nécessaires à son fonctionnement. Le premier, src, va servir à indiquer le lien de l'image à afficher. Le second, alt, va servir à indiquer un texte de remplacement dans le cas où le lien ne fonctionnerait plus.



Je t'ai vu tiquer. Tu as vu le schéma et tu t'es demandé "valeurs ?". Une valeur c'est simplement le nom de l'information ou des informations communiquées par l'attribut.

L'attribut s'écrit de la manière suivante : nom de l'attribut, suivit d'un égal et de la valeur intégré entre guillemets. Il est possibles qu'un attribut possède plusieurs valeurs. C'est le cas de l'attribut style qui peut posséder de nombreuses valeurs comme le fond ou la police d'écriture.

Les balises et les attributs ne sont pas affichés sur le rendu final, donc ce qui sera affiché sur internet. Ils ne sont là uniquement pour indiquer au web comment traiter les informations.

Les éléments sont la base de tout. Ils donnent des informations sur les composants de la page ou du code. Ils peuvent être composés de balises simples comme de balises doubles, composées elles-mêmes d'attributs. Ces attributs sont agrémentées de valeurs qui disent au web quoi afficher.