SELFHTML: HTML/XHTML / Éléments pour structurer le texte / Texte pré-formaté (tel qu'il est saisi dans l'éditeur)

	Texte pré-formaté (tel qu'il est saisi dans l'éditeur)
	Définir un passage de texte avec du texte pré-formaté Largeur d'un passage avec du texte pré-formaté Éléments HTML plus anciens pour du texte pré-formaté Formater du texte pré-formaté avec les feuilles de style CSS Autres informations

Définir un passage de texte avec du texte pré-formaté

Pour les impressions de programme il est important qu'ils soient représentés en police courrier et que les retraits soient restitués comme ils furent entrés lors de l'édition. Dans ce but HTML offre la possibilité des " passages de texte pré-formaté". Même quand vous devez représenter des données en tableau et que vous voulez renoncer aux tableaux vous pouvez utiliser du texte pré-formaté. Finalement le texte pré-formaté est également approprié pour aligner d'autres éléments, des graphiques par exemple.

Exemple:

Exemple d'affichage: aperçu

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Texte du titre</title>
</head>
<body>
<h1>Pâques avec Pascal</h1>

<pre>
  FUNCTION calculpaques(year : INTEGER) : INTEGER;
  VAR  a, b, c, d, e, f, g, h, i, k, l, m : INTEGER;
  BEGIN
     a  :=  year MOD 19;
     b  :=  year DIV 100;
     c  :=  year MOD 100;
     d  :=  b DIV 4;
     e  :=  b MOD 4;
     f  :=  ( b + 8 ) DIV 25;
     g  :=  ( b  f + 1 ) DIV 3;
     h  :=  ( 19 * a + b  d  g + 15 ) MOD 30;
     i  :=  c DIV 4;
     k  :=  c MOD 4;
     l  :=  ( 32 + 2 * e + 2 * i  h  k ) MOD 7;
     m  :=  ( a + 11 * h + 22 * l ) DIV 451;
     Easter :=  h + l  7 * m + 22;
  END{FUNC};
</pre>

</body>
</html>

Explication:

<pre> introduit un passage de texte pré-formaté (pre = preformatted = pré-formaté). </pre> termine le passage. Tout ce qu'il y a entre deux sera affiché comme cela a été entré à savoir en police courrier.

Attention:

À l'intérieur de <pre> et de </pre> sont à respecter, comme pour d'autres passages de texte, les particularités pour les alphabets, caractères spéciaux et caractères HTML spécifiques. Les commandes placées entre <pre> et </pre> sont interprétées. L'avantage en est que vous pouvez par exemple dans du texte pré-formaté incorporer des graphiques:
Exemple d'affichage: aperçu

Largeur d'un passage avec du texte pré-formaté

Vous pouvez fixer la largeur pour un passage de texte formaté. "largeur" veut dire dans ce cas: le nombre maximum de signes par ligne.

Exemple:

Exemple d'affichage: aperçu

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Texte du titre</title>
</head>
<body>
<h1>Fichiers MIDI</h1>

<pre width="80">
YBREEZE  MID        17.845  15.06.97   6:01 ybreeze.mid
YGLADTR  MID        34.552  15.06.97   6:01 ygladtr.mid
YHASTE   MID        27.834  15.06.97   6:01 yhaste.mid
YRAG     MID        18.540  15.06.97   6:01 yrag.mid
YRITMO   MID        29.056  15.06.97   6:01 yritmo.mid
         5 fichier(s)               127.827 Bytes
</pre>

</body>
</html>

Explication:

Avec l'attribut width= dans le repère d'ouverture <pre> vous indiquez une largeur maximale pour les lignes du passage. Dans l'exemple ci-dessus, une ligne ne peut pas avoir plus de 80 signes.

Pour les lignes plus longues le navigateur peut soit choisir une autre police pour respecter la largeur ou bien il passe à la ligne pour les lignes trop longues.

Attention:

La mention de la largeur d'un passage pré-formaté n'est interprété ni par Netscape 4.x ni par l' Explorer Internet MS 4.x et est classée entre-temps comme en cours d'abandon et doit donc à l'avenir quitter le standard HTML.

Éléments HTML plus anciens pour du texte pré-formaté

Par souci d'exhaustivité, il faut mentionner ici quelques éléments plus anciens qui ne font plus partie pour aucun d'entre eux du standard HTML.

<xmp>...</xmp> (xmp = example = exemple) était alors conçu pour un marquage logique pour des exemples de code-source.
<plaintext>...</plaintext> (plaintext = pur texte ) était conçu pour la représentation de pur texte par exemple pour effectuer des citations d'un fichier texte non formaté.
<listing>...</listing> (listing = texte source orienté lignes) était conçu pour le code source de programmes.

Attention:

Ces trois commandes n'ont dans la pratique pour ainsi dire plus d'utilisation. Si vous n'avez pas de raison particulière vous devez utiliser <pre> ... </pre> pour représenter du texte pré-formaté.

La différence entre <xmp>...</xmp> et <listing>...</listing> réside dans l'espacement des caractères. <xmp>...</xmp>rend une police aux caractères plus espacés (environ 80 caractères/ligne à l'impression), <listing>...</listing> une police plus ramassée (environ 132 caractères/ligne à l'impression). <listing>...</listing> est aussi représenté quelque peu différemment par Netscape que <pre>...</pre>.

Netscape n'accepte pour ce repère <plaintext> aucun repère de fermeture </plaintext>, alors que d'autres navigateurs interprètent le repère de fermeture. Netscape représente tout en qualité courrier jusqu'à ce que vous entriez la prochaine commande de paragraphe (par exemple titre, changement de paragraphe, paragraphe de remarque, liste etc...

formater du texte pré-formaté avec les feuilles de style CSS

Vous n'avez aucune influence en HTML sur le genre de police ou la taille de police dans lesquelles le texte pré-formaté doit être exactement représenté. Les navigateurs utilisent leur formatage par défaut. Avec les feuilles de style CSS vous pouvez cependant formater un tel élément comme vous le souhaitez. Pour utiliser des feuilles de style CSS vous devez d'abord savoir comment définir des formats CSS. Ensuite, vous serez en mesure d'appliquer les propriétés CSS. En relation avec ce qui vient d'être décrit les données de feuilles de style suivantes sont aussi intéressantes:
formatage de la police
alignement et paragraphes
espaces marges extérieures
espace intérieur
cadres
couleurs et images d'arrière plan

Exemple:

Exemple d'affichage: aperçu

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Texte du titre</title>
</head>
<body>
<h1>Développement de logiciels</h1>

<pre style="background-color:#000099; color:#FFFF00; font-family:Fixedsys,Courier; padding:10px;">
#include &lt;nonsense.h&gt;
#include &lt;lies.h&gt;
#include &lt;spyware.h&gt; /* Microsoft Network Connectivity library */
#include &lt;process.h&gt; /* For the court of law */
<!-- etc... -->
</pre>

</body>
</html>

Explication:

L'élément pre dans l'exemple reçoit une couleur d'arrière plan bleue, une couleur de police jaune, et comme police d'écriture "Fixedsys" est désirée ou, au cas ou elle n'est pas disponible une police courrier. En outre, afin que le texte ne colle pas trop au bord, un espace intérieur de 10 pixels a été défini.

Autres informations

Dans le sommaire de référence HTML vous trouverez des données précisant où le texte pré-formaté peut être mis, quels autres éléments il peut contenir, quels attributs l'élément pre peut avoir et ce à quoi il faut veiller pour ces différents attributs:
référence pour les éléments pour le texte pré-formaté (<pre>...</pre>)
référence pour les attributs pour le texte pré-formaté (<pre>...</pre>)


	Marquage logique de texte
	Citations et adresses

SELFHTML/Aides à la navigation

HTML/XHTML

Éléments pour structurer le texte