nb : toutes les balises nommées deront notées en italique, en gras et uniquement identifiées par leur nom, par exemple html pour <html></html>
nb2 : je vous invite à regarder le code source de cette page (possible avec tous les navigateurs) pour bien comprendre la structure du document

Mis à part les tableaux qui sont vraiment des éléments particuliers, on distingue 2 grandes familles de balises html : les balises de type bloc et les balises inline.

Les balises de type bloc ont pour particularité de s'afficher les unes après les autres verticalement, après chaque élément, il y a un retour à la ligne. Le flux de texte est interrompu. On peut bien sur prévenir ça avec un style CSS. Liste de balise de type bloc :

balise div

balise h1 (c'est une balise pour du titre important)

balise h2 (titre moins important, on en trouve d'autres sous la forme h#)

balise p

hr pour tracer une ligne :

A l'inverse, les balises inline ne cassent pas le flux de texte et sont plus adaptées à de la mise en forme de texte :

balise span, la balise em permet de mettre en italique (i est déconseillé), la balise strong met le texte en gras (b est déconseillé), et u pour souligner. Le span est utilisé pour attribuer un style css particuler à un élément de texte. Dans les balises inline, on note également la balise a qui permet de faire des liens.balise img balise img

Le style CSS permet de mettre en forme tous ces éléments à des degrés divers. On ne peut ainsi pas positionner en coordonnées un élément de style inline (normal il est dans le flux de texte), mais ce n'est pas possible non plus sur toutes les balises bloc. Le langage css n'est pas de l'html. Pour définir un style, on le nomme et ensuite on décrit ses propriétés entre des accolades {}.

Pour identifier un élément en css, on utilise 3 méthodes :

• par le nom de la balise :
body{} h1{} div{} span{}
Dasns ce cas tous les éléments mis en forme avec cette balise adopteront le style css correspondant.

• avec des classes, identifiée par un point . devant :
.monStyle{} .titre{} .texteRouge{} .texteVert{}
Dans ce cas il faudra rajouter un attribut class à la balise correspondante. On peut attribuer une même classe à plusieurs éléments. Mettons que je veuille attribuer le style texteRouge à une balise de titre, mon code ressemblera à :

<h1 class="titreRouge">Le titre avec la classe titre rouge</h1>

• avec un identifiant, identifié par un dièse # devant :
#bandeau{} #conteneur{} #titrePrincipal{}
Dans ce cas il faudra rajouter un attribut id à la balise correspondante. On ne peut attribuer qu'un seul id à un seul élément dans le code. Si on a envie (ou besoin) de mettre plusieurs id, alors il faut passer par une classe. Si je veux attribuer un id à un div le code ressemblera à :

Div auquel on a attribué l'id conteneur

Ensuite pour ajouter des propriétés à un style css, il faut les décrires à l'intérieur des accolades. A savoir qu'on trouve pour plusieurs d'entre elles des propriétés en top, bottom, left, right, qui permettent de préciser des execptions pour des côtés.

liste de propriétés de styles css (non exaustive) :