Formatage de texte en XHTML

Tous les élements qui doivent apparaître sur vos pages HTML sont insérés entre la <body> et </body>

Insérer un commentaire

A noter : les commentaires vous servent de repère et n'apparaissent pas dans le contenu de vos pages

Texte en gras

Exemple : Texte en gras

<strong> Texte en gras </strong>

Exemple :Texte en italique

<em> Texte en italique </em>

Texte en souligné (Plus conforme)

Exemple : Texte souligné

<u> Texte souligné </u>

Citation de paragraphe

Exemple:

Citation de paragraphe

<blockquote> Citation de paragraphe</p>

Texte préformaté

Exemple :

Texte préformaté

<pre>Texte préformaté</pre>

Les balises d'entête

Ces balises n'ont pas le "look classique" des balises d'entête.
Dans notre exemple, elles sont modifiées avec CSS

La balise h1 est la plus grande, la balise h6, la plus petite

Exemple

Balise d'entete h1

Balise d'entete h2

Balise d'entete h3

Balise d'entete h4

Balise d'entete h5

Balise d'entete h6

<h1>Balise d'entete h1</h1>
<h2>Balise d'entete h2</h2>
<h3>Balise d'entete h3</h3>
<h4>Balise d'entete h4</h4>
<h5>Balise d'entete h5</h5>
<h6>Balise d'entete h6</h6>

Listes non ordonnée, liste à puce

Elément liste
Elément liste
Elément liste
Elément liste

<ul>
<li>Elément liste</li>
<li>Elément liste</li>
<li>Elément liste</li>
<li>Elément liste</li>
</ul>

Listes ordonnées

Elément liste
Elément liste
Elément liste
Elément liste

<ol>
<li>Elément liste</li>
<li>Elément liste</li>
<li>Elément liste</li>
<li>Elément liste</li>
</ol>

Un paragaraphe

Exemple:

Voici un paragraphe en XHTML certes qui ne contient pas beaucoup de contenu, certes, mais mieux que rien !

<p>Voici un paragraphe en XHTML certes qui ne contient pas beaucoup de contenu, certes, mais mieux que rien !</p>

Quelques attributs

Texte aligné à gauche dans un bloc de paragraphe

<p>Texte aligné à gauche par défaut</p>

Texte aligné à droite dans un bloc de paragraphe

<p align="right">Texte aligné à droite</p>

Texte au centre dans un bloc de paragraphe

<p align="center">Texte au centre</p>

Texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié , texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié dans un bloc de paragraphe

<p align="justify">Texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié , texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié, texte justifié dans un bloc de paragraphe</p>

Nous aurions pu utiliser ces attibuts sur d' autres balises HTML comme

h1,h2,h3,h4,h5,h6

<h1 align="center">Entête au centre</h1>

<div>

<div align="center">Texte au centre dans une balise div</div>

Obsoléte ou bien moins utilie !

font

Mise en forme de texte dans HTML, il est préférable de le gérer avec CSS

Exemple

Texte en rouge taille 4, police Arial, Helvetica, sans-serif

<font color="#FF0000" size="4" face="Arial, Helvetica, sans-serif">Texte en rouge ta,ille 4, police Arial, Helvetica, sans-serif</font>

Marquee

Exemple :

Texte

La balise marquee est obsoléte, elle permet de faire un déplacement d'objet horizontal ou vertical avec différents comportement en fonction des attributs

<marquee behavior="scroll" direction="left">Texte</marquee>

Quelques attributs

behavior = scroll, slide, alternate

direction : left, right, up, down

FORMATAGE DE TEXTE	CODE HTML / XHTML
Liste des définition	<dl>Liste des définition</dl>
Terme de définition	<dt>Terme de définition</dt>
Description de définition	<dd>Description de définition</dd>
Abréviation	<abbr title="Abréviation de je ne sais quoi" lang="fr">Abréviation</abbr>
Acronyme	<acronym title="Acronyme de je ne sais quoi" lang="fr">Acronyme</acronym>

Programme

Utiles