• Article
  • Discussion
  • Modifier
  • Historique

Listes à puces, listes numérotées, listes descriptives, texte préformaté

Un article de Eric Bruyndonckx.

Sommaire

[modifier] Thèmes

  • Listes énumératives
  • Listes numérotées
  • Listes de menus
  • Listes de répertoires
  • Texte pré-formaté

[modifier] Listes énumératives 

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

[modifier] Listes numérotées 

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

[modifier] Listes de définitions (glossaire) 

<dl>
  <dt>Expression à définir</dt>
  <dd>Définition de l'expression</dd>
</dl>

[modifier] Listes de menus 

<menu>
  <li>Elément de liste</li>
  <li>Elément de liste</li>
</menu>

[modifier] Listes de répertoires 

<dir>
  <li>Elément de liste</li>
  <li>Elément de liste</li>
</dir>

[modifier] Texte pré-formaté

Pour les impressions de programme il est important que la police utilisée soit Courrier et que les retraits soient restitués comme ils furent entrés lors de l'édition. Le texte pré-formaté est également approprié pour aligner d'autres éléments, des graphiques par exemple. 

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

[modifier] Exercices

[modifier] Données

[modifier] Exercice 1

Reproduire la liste ci-dessous  :

Liste à puce :

  • Point 1
  • Point 2
  • Point 3
  • Point 4

[modifier] Exercice 2

Reproduire la liste ci-dessous  :

Liste à puce :

  1. Point 1
  2. Point 2
  3. Point 3
  4. Point 4

[modifier] Exercice 3

Reproduisez la liste à puces imbriquées ci-dessous :

[modifier] Exercice 4

Reproduire le dessin ci-dessous :

ou affichez la formule ci-dessous :

[modifier] Corrigés

[modifier] Exercice 1 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title>Liste à puces 1</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 </head>
 <body>
  <ul>
   <li>Point 1</li>
   <li>Point 2</li>
   <li>Point 3</li>
   <li>Point 4</li>
  </ul>
 </body>
</html>

[modifier] Exercice 2 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title>Liste à puces 2</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 </head>
 <body>
  <ol>
   <li>Point 1</li>
   <li>Point 2</li>
   <li>Point 3</li>
   <li>Point 4</li>
  </ol>
 </body>
</html>

[modifier] Exercice 3 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title>Liste à puces</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 </head>
 <body>
  <ol>
   <li>Point 1 :
    <ul type="disc">
     <li>Sous-point 1.1</li>
     <li>Sous-point 1.2</li>
    </ul>
   </li>
   <li>Point 2 :
    <ul type="circle">
     <li>Sous-point 2.1</li>
     <li>Sous-point 2.2</li>
    </ul>
   </li>
   <li>Point 3 :
    <ul type="square">
     <li>Sous-point 3.1</li>
    </ul>
   </li>
   <li>Point 4 :
    <ul type="square">
     <li>Sous-point 4.1</li>
    </ul>
   </li>
  </ol>
 </body>
</html>

[modifier] Exercice 4 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title>Texte préformaté</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 </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>

[modifier] Voir aussi

Récupérée de « http://www.ebx.ch/mediawiki1/index.php/Listes_%C3%A0_puces%2C_listes_num%C3%A9rot%C3%A9es%2C_listes_descriptives%2C_texte_pr%C3%A9format%C3%A9 »