(Il n'y aura rien sur les couleurs ou la mise en page des textes, tout sera vu plus tard, avec les feuilles de style).
<h1>,
<h2>,
<h3>,
<h4>,
<h5>,
<h6> : ce sont les
structures de base pour obtenir un plan de votre texte. Ces
balises définissent les titres
(« h »
comme Header, c'est-à-dire
en-têtes) de différents niveaux (comme
titre1, titre2,
titre3, etc. dans un traitement de
texte).
Ainsi ce code source :
Bla bla
bla.
<h1>Un titre</h1>
Bla bla bla.
Bla bla bla.
<h2>Un sous-titre</h2>
Bla bla bla.
Bla bla bla.
<h2>Un autre sous-titre</h2>
Bla bla bla.
Bla bla bla.
<h1>Un autre titre</h1>
Bla bla bla.
Bla bla bla.
produira ce résultat :
<p> : retour à la ligne impératif
(P pour
Paragraph). Vous avez sans doute remarqué
que les retours à la ligne dans le code source n'ont aucun
effet sur le résultat affiché. (Si ce n'est pas le cas
regardez les 3 premiers « bla » de
l'exemple précédent, et comparer leur disposition dans le code
source et dans le résultat affiché.) Vous devrez donc
forcer les retours à la ligne. Cela
correspond à l'appui sur la touche Entrée
dans un traitement de texte.
L'utilisation de la balise fermante
</p> est inutile (pour l'instant).
<ul>,
<ol>,
<li> : tout ce
qu'il faut pour faire des listes, numérotées ou non. Les
éléments de liste sont définis par
<li> (pour
List Item), qu'ils soient numérotés ou
non. C'est le type de liste
<ul> (pour
Un-numbered List) ou
<ol> (pour
Ordered List) qui définit la présence ou
pas de numérotation.
Ainsi ce code source :
Une liste non numérotée:
<ul>
<li>un,
<li>deux,
<li>trois.
</ul>
Une liste numérotée:
<ol>
<li>un,
<li>deux,
<li>trois.
</ol>
produira ce résultat :
<em>,
<strong>,
<kbd> : les seules
balises de mise en valeur que nous verrons. Elle ne
définissent pas la présentation, mais le type de texte. Ce
type sera traduit à l'écran d'une manière à peu près identique
dans tous les navigateurs, mais ce n'est pas garanti (et cela
n'a d'ailleurs aucune importance).
<em> signifie
Emphatized (mis en
valeur). Cela se traduira la plupart du
temps par de l'italique.
<kbd> désigne du
texte dont on veut montrer qu'il a été ou doit être tapé
au clavier (KeyBoarD). Cela se
traduira la plupart du temps par
l'utilisation d'une police de type
courrier (dite aussi
à chasse fixe).
Ainsi ce code source :
Le texte peut être mis en valeur de plusieurs manières, qui
se traduisent <em>par
des italiques</em>,
<strong>du
gras</strong> ou
<kbd>une police à
chasse
fixe</kbd>. Mais on
<strong>peut
<em>aussi
<kbd>imbriquer</kbd>
les</em>
<kbd>styles</kbd></strong>.
produira ce résultat :
<hr> :
un trait horizontal (Horizontal
Rule) sur toute la largeur du texte.
La balise de fermeture n'existe pas.
<a
href="***"> : pour construire des
liens hypertextes (c'est quand même le but
premier de HTML...).
La syntaxe en est simple. Pour construire un lien vers ma page, il suffit d'écrire ceci :
vers <a href="http://www.grappa.univ-lille3.fr/~gonzalez">ma</a> page.
Que peut-on mettre comme adresse après
href ?
une adresse complète d'une page qui se trouve n'importe où
sur le web (il est impératif de faire
figurer http://).
le nom seul d'un fichier qui se trouve dans le même
répertoire (sans http://).
le chemin relatif d'accès à un fichier qui se trouve sur
le même site, mais pas dans le même répertoire (sans
http://).
Il reste les balises de construction de tableaux et d'insertion d'images qu'on verra plus tard.